+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Prosty suwak jako input (/thread-prosty-suwak-jako-input)
Prosty suwak jako input - bor1904 - 14-04-2010
Witam
Chciałbym użyć w formularzu suwaka do ustawiania wartości procentowych.
Chodzi mi tylko o zwykły szary suwak bez absolutnie żadnych bajerów.
W necie znalazłem dziesiątki przykładów jednak moja cala rozbudowana aplikacja to kilka plików php i nie chce by kod obsługujący jeden suwak miał 4-5 plików - bo takie też się zdarzają.
Czy ktoś potrafi mi z palca napisać albo wskazać stronę z takim suwaczkiem albo po prostu powiedzieć , że jest to niewykonalne w kilku liniach kodu?
Z góry dziękuje
RE: Prosty suwak jako input - Kartofelek - 15-04-2010
W kiklu raczej nie.
Ogólna zasada jest prosta:
Robisz div szeroki (z jakims tlem i opsition:relative)
w nim ustawiasz maly div, z position:absolute (np id=scrool);
Po onclick na scrool wywolujesz funckcje startdrag, ale nie zmieniasz y i dodatkowo spradzasz czy przypadkiem pozycja mychy sie miesci sie w ramach szerokiego diva.
W czasie przesuwania sprawdzasz pozycje offsetLeft malego diva - i to jest twoja wartosc. Oczywiscie musisz jeszcze przeliczyc ja na % (skorzystaj z szerokosci szerokiego diva).
Jak widzisz - sam opis zajmuje kilka linijek. W "pure" javascript zajmie ci to trochę więcej, bo samo wykrycie pozycji myszki to z 10-15 linijek kodu (mowie o czytelnym kodzie, a nie optymalizowanym)
Osobiście wolałbym:
zapodajesz jquery z odwolaniem do googla (patrz zrodlo jquery.com)
zapodajesz biblioteke suwaczka np:
http://www.willjessup.com/sandbox/jquery/scrollbar/scrollbar.html
http://www.kelvinluck.com/assets/jquery/jScrollPane/basic.html
uruchamiasz suwaczek 1-2 linijkami kodu. włala. to działa
A jak nie chcesz dodatkowych bibliotek, to tak samo jak jquery zapusc sobie jqueryUI i tam tez masz scrollbary
Kodu nic. Transferu nic (bo idzie od nich). Czego chcieć więcej