Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [PHP][AJAX]Skrypt notatnika.
Mike122
post 20.08.2009, 11:09:42
Post #1





Grupa: Zarejestrowani
Postów: 253
Pomógł: 1
Dołączył: 12.04.2006

Ostrzeżenie: (0%)
-----

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.


--------------------

Największy błąd ze wszystkich błędów to nie słuchać dobrych rad. Nikt nie jest doskonały i nie należy się obrażać za konstruktywną krytykę.
Go to the top of the page
+Quote Post
sebekzosw
post 20.08.2009, 11:57:59
Post #2





Grupa: Zarejestrowani
Postów: 437
Pomógł: 42
Dołączył: 16.04.2007

Ostrzeżenie: (0%)
-----

http://mintajax.pl/Przewodnik/Drag-n-Drop/ - coś takiego?
Go to the top of the page
+Quote Post
emp
post 20.08.2009, 12:47:46
Post #3





Grupa: Zarejestrowani
Postów: 195
Pomógł: 14
Dołączył: 12.01.2006
Skąd: Gotham City

Ostrzeżenie: (0%)
-----

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 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5.         <title></title>
  6.         <script language="javascript" type="text/javascript" src="prototype.js"></script>
  7.  
  8.     </head>
  9.     <body>
  10.         <script language="javascript">
  11.             var ElementPrzeciagany = null ;
  12.             var IloscWarstw = 0 ;
  13.  
  14.             Event.observe( document, 'mouseup'  , zabron_przeciagac, false );
  15.             Event.observe( document, 'mousemove', przeciagaj, false);
  16.  
  17.             function zabron_przeciagac( zdarzenie )
  18.             {
  19.                     if( ElementPrzeciagany != null )
  20.                     {
  21.                             ElementPrzeciagany.style.opacity = 1 ;
  22.                             ElementPrzeciagany = null ;
  23.                     }
  24.             }
  25.  
  26.             function przeciagaj( zdarzenie )
  27.             {
  28.                     if( Event.isLeftClick( zdarzenie ) )
  29.                     {
  30.                             if( ElementPrzeciagany != null )
  31.                             {
  32.                                     if( ElementPrzeciagany.getAttribute('plywajacy') != null )
  33.                                     {
  34.                                             var myszx = Event.pointerX( zdarzenie )-10 ;
  35.                                             var myszy = Event.pointerY( zdarzenie )-5 ;
  36.  
  37.                                             var przesuniecieX = myszx - ElementPrzeciagany.myszx ;
  38.                                             var przesuniecieY = myszy - ElementPrzeciagany.myszy ;
  39.  
  40.                                             ElementPrzeciagany.style.top = przesuniecieY+"px" ;
  41.                                             ElementPrzeciagany.style.left = przesuniecieX+"px" ;
  42.  
  43.                                     }
  44.                             }
  45.                     }
  46.             }
  47.  
  48.             function pozwol_przeciagac( zdarzenie )
  49.             {
  50.                     if( Event.isLeftClick( zdarzenie ) )
  51.                     {
  52.                     var element = Event.element( zdarzenie );
  53.  
  54.                                 while( element.getAttribute('plywajacy') == null  )
  55.                                 {
  56.                                     element = element.parentNode ;
  57.                                 }
  58.  
  59.                                     element.style.opacity = 0.7 ;
  60.  
  61.                                     element.myszx = Event.pointerX( zdarzenie ) -  element.offsetLeft ;
  62.                                     element.myszy = Event.pointerY( zdarzenie ) -  element.offsetTop ;
  63.  
  64.                                     ElementPrzeciagany = element ;
  65.  
  66.                                     element.style.zIndex = ++IloscWarstw ;
  67.                     }
  68.             }
  69.  
  70.             function ustaw_warstwe_jako_plywajaca( id )
  71.             {
  72.                     $( id ).setAttribute("myszx", 0 ) ;
  73.                     $( id ).setAttribute("myszy", 0 ) ;
  74.                     $( id ).setAttribute("plywajacy", "true" ) ;
  75.                     $( id ).setAttribute("minimalizacja", "false" ) ;
  76.  
  77.                     Event.observe( id, 'mousedown', pozwol_przeciagac, false);
  78.                     IloscWarstw ++ ;
  79.             }
  80.         </script>
  81.         <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>
  82.         <script language="javascript">
  83.             ustaw_warstwe_jako_plywajaca( "id_notatki" ) ;
  84.         </script>
  85.     </body>
  86. </html>
[HTML] pobierz, plaintext


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

Ten post edytował emp 20.08.2009, 12:49:20


--------------------
Temat zamykam i przenoszę do Bangladeszu.
To jest wiadomość śmierci jeśli ją czytasz to znaczy że pozostało ci 30 sekund życia, więc lepiej zacznij się modlić.
Go to the top of the page
+Quote Post
Fifi209
post 20.08.2009, 13:17:15
Post #4





Grupa: Zarejestrowani
Postów: 4 655
Pomógł: 556
Dołączył: 17.03.2009
Skąd: Katowice

Ostrzeżenie: (0%)
-----

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

Znajdziesz coś winksmiley.jpg


--------------------
Zainteresowania: C#, PHP, JS, SQL, AJAX, XML, C dla AVR
Chętnie pomogę, lecz zanim napiszesz: Wujek Google , Manual PHP
Go to the top of the page
+Quote Post
Mike122
post 20.08.2009, 14:59:21
Post #5





Grupa: Zarejestrowani
Postów: 253
Pomógł: 1
Dołączył: 12.04.2006

Ostrzeżenie: (0%)
-----

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

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


--------------------

Największy błąd ze wszystkich błędów to nie słuchać dobrych rad. Nikt nie jest doskonały i nie należy się obrażać za konstruktywną krytykę.
Go to the top of the page
+Quote Post
« Następny starszy · Szukam · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 16.04.2024 - 18:45
Powered By IP.Board © 2024  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn