Forum PHP.pl > [PHP][AJAX]Skrypt notatnika.

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [PHP][AJAX]Skrypt notatnika.

Forum PHP.pl > Forum > Gotowe rozwiązania > Szukam

Mike122

20.08.2009, 11:09:42

Szuka skryptu który po naciśnięciu linka otworzy div który można przeciągać dowolnie po całej stronie w div umieszczony jest formularz gdzie można zapisywać różne notatki pe edycji oczywiście zapisanie danych do bazy MySQL po przez przycisk zapisania. Może być coś nawet podobnego mogę to spokojne przerobić najlepiej by było na jQuery.

sebekzosw

20.08.2009, 11:57:59

http://mintajax.pl/Przewodnik/Drag-n-Drop/ - coś takiego?

emp

20.08.2009, 12:47:46

Przy użyciu prototype.js , ale nad tym trzeba jeszcze popracować
Jeżeli chcemy przeciągać jakąs warstwe musi ona być w strykturze html ze stylem position abolute i indentyfikatorem
Nastepnie wystarczy wywolac metode ustaw_warstwe_jako_plywajaca( "id_notatki" ) ;

[HTML] pobierz, plaintext 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title></title>
        <script language="javascript" type="text/javascript" src="prototype.js"></script>
 
    </head>
    <body>
        <script language="javascript">
            var ElementPrzeciagany = null ;
            var IloscWarstw = 0 ;
 
            Event.observe( document, 'mouseup'  , zabron_przeciagac, false );
            Event.observe( document, 'mousemove', przeciagaj, false);
 
            function zabron_przeciagac( zdarzenie )
            {
                    if( ElementPrzeciagany != null )
                    {
                            ElementPrzeciagany.style.opacity = 1 ;
                            ElementPrzeciagany = null ;
                    }
            }
 
            function przeciagaj( zdarzenie )
            {
                    if( Event.isLeftClick( zdarzenie ) )
                    {
                            if( ElementPrzeciagany != null )
                            {
                                    if( ElementPrzeciagany.getAttribute('plywajacy') != null )
                                    {
                                            var myszx = Event.pointerX( zdarzenie )-10 ;
                                            var myszy = Event.pointerY( zdarzenie )-5 ;
 
                                            var przesuniecieX = myszx - ElementPrzeciagany.myszx ;
                                            var przesuniecieY = myszy - ElementPrzeciagany.myszy ;
 
                                            ElementPrzeciagany.style.top = przesuniecieY+"px" ;
                                            ElementPrzeciagany.style.left = przesuniecieX+"px" ;
 
                                    }
                            }
                    }
            }
 
            function pozwol_przeciagac( zdarzenie )
            {
                    if( Event.isLeftClick( zdarzenie ) )
                    {
                    var element = Event.element( zdarzenie );
 
                                while( element.getAttribute('plywajacy') == null  )
                                {
                                    element = element.parentNode ;
                                }
 
                                    element.style.opacity = 0.7 ;
 
                                    element.myszx = Event.pointerX( zdarzenie ) -  element.offsetLeft ;
                                    element.myszy = Event.pointerY( zdarzenie ) -  element.offsetTop ;
 
                                    ElementPrzeciagany = element ;
 
                                    element.style.zIndex = ++IloscWarstw ;
                    }
            }
 
            function ustaw_warstwe_jako_plywajaca( id )
            {
                    $( id ).setAttribute("myszx", 0 ) ;
                    $( id ).setAttribute("myszy", 0 ) ;
                    $( id ).setAttribute("plywajacy", "true" ) ;
                    $( id ).setAttribute("minimalizacja", "false" ) ;
 
                    Event.observe( id, 'mousedown', pozwol_przeciagac, false);
                    IloscWarstw ++ ;
            }
        </script>
        <div id="id_notatki" style="top:50px;left:50px;cursor:move;border-style:solid;border-width:1px;position:absolute;width:300px;height:300px;background-color:rgb(250,0,0)"></div>
        <script language="javascript">
            ustaw_warstwe_jako_plywajaca( "id_notatki" ) ;
        </script>
    </body>
</html>
[HTML] pobierz, plaintext

Drag&Drop jest też tu Scriptaculous i proponuje raczej wykorzystać gotowy skrypt jak wyżej w poście lub ten.

Fifi209

20.08.2009, 13:17:15

http://jqueryui.com/demos/draggable/

Znajdziesz coś

Mike122

20.08.2009, 14:59:21

Znam adresy te adresy i nazwy bibliotek myślałem bardziej nad jakimś gotowcem

Jednak dziękuję za odpowiedzi napisze już to sam.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.