Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Uneori trebuie doar să fie făcut pe unitatea de pagină, care ar avea o bară de defilare. Desigur, există cadre recules, dar pentru faptul că ei au murit dupa mult timp propria lor, ei nu ne convine. Aș dori să fie o soluție în care div obișnuite ar putea prisobachit defilare. Și această decizie este, și nu una, ci toate cu utilizarea de caracteristici AJAX.

Derularea verticală folosind jScrollPane

cuvinte comune

Trucuri de comerț

Plugin-ul am folosit pentru a practica de câteva ori. Un astfel de exemplu poate fi văzut aici. Aspectul este non-standard, care este bun - poti modela, tot ceea ce doreste inima (nu sufletul, prietenul meu, și clienții, clienții noștri -. Nn).

Uneori plugin necesită instalarea plugin-uri dopolnitelnyyh pentru a lucra roata mouse-ului pentru a defila și defilați pentru a schimba dimensiunea în funcție de cantitatea de conținut. Cu toate acestea, experiența a arătat că funcționează fără ele. Desigur, pot construi un plug-in unele graba undeva, dar este puțin probabil, agitând din pare oficial.

Destul de detaliate Info cod nu va dezasambla, în principiu, nimic complicat acolo. Cu toate acestea, în anumite puncte mă opresc.

HTML-fișier. defilare structura unității cu următoarele



conținut

Există un div extern cu clasa, există un div interior cu ID-ul și clasa trebuie să derulați-pane. Totul. Funcția este după cum urmează:

Când se apelează parametri Specifică diferite, cum ar fi lățimea bara de derulare (scrollbarWidth), mărimea săgețile sale (arrowSize) și așa mai departe. Cele mai importante sunt următoarele:

scrollbarWidth [numărul] - lățimea de derulare (implicit 10)

scrollbarMargin [număr] - umplutură la stânga bara de derulare (implicit 5)

wheelSpeed ​​[numărul] - viteza rotiță de derulare în pixeli (implicit 18)

showArrows [logic] - arată săgețile grafice sau nu (implicit false)

arrowSize [numărul] - înălțimea de săgeată, în cazul în care showArrows = true (calculat folosind CSS, dacă nu este specificat)

dragMinHeight [număr] - cursor înălțime minimă (implicit 0)

dragMaxHeight [numărul] - înălțimea maximă a glisorului (implicit este 99999!)

scrollbarOnLeft [logic] - dacă aveți nevoie de o bară de derulare pe stânga, setați true.

Acum, fișierul jscroll.css deschis. A se vedea linia următoare.

8-15 linii. Internă a pus lățimea și înălțimea div (!), Overflou (parametru opțional pare), padding este probabil nevoie, restul nu contează.

17-19 rânduri. Elementul div exterior. Aici nu este nicidecum imposibil să prescrie înălțime. și asigurați-vă că pentru a specifica float: left. Toate acestea se face cu un singur scop - pentru Opera 10 pentru a lucra în mod normal, cu sulurile. În cazul în care acest lucru nu se conformează, apoi derulați Diva este în sincronizare cu browser-ul de defilare și, ca urmare a obține un nonsens total. Păstrați acest lucru în minte.

23-57 rânduri. Stiluri de imagini pentru defilare

Schimbarea rândurile rămase în teorie, nu este necesară.

defilare verticală și orizontală pe FleXcroll

Nu este atât de familiar cu acest script. El merge fără a utiliza jQuery, care este un plus (dar nu întotdeauna bine jQuery nevoie). Al doilea avantaj este că există o defilare pe orizontală. Al treilea avantaj este că, în arhiva cu plugin-ul atașat exemple de utilizare, cu un bun divers, ceea ce un mare respect.

Cu plug-in nu trebuie sa lucreze la proiecte, dar prima întâlnire sa dovedit a fi una plăcută. Singurul dezavantaj este văzut în faptul că cursorul nu este convertit atunci când treceți mouse-ul pentru a „manipula“. Cred că e un minus, deoarece poate fi defilare intuitiv neclare sau nu. Cu toate acestea, cred că totul prin css nu va rezolva problema.

La sfârșitul

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Singurul dezavantaj este văzut în faptul că cursorul nu este convertit atunci când treceți mouse-ul pentru a „manipula“. Cred că e un minus, deoarece poate fi defilare intuitiv neclare sau nu.

Dacă este intuitiv clar că derulați - o nafig de derulare. Utilizatorul nu mă va înțelege aici această tulpină „stilou“

PS. Exemplu de conținut nu este scrolled roata mouse-ului - asta e un mare minus!

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Personal, flekskrollom nu am folosit, dar aproape nici o îndoială că CSS poate fi atribuit cursorului elementul dorit: pointer și truc =)

verificat toate instanțele de derulare, a devenit trecere pobrauzerno, poticnit la Fox care nu funcționează. Faptul este că, pentru a derula în unele browsere au nevoie de dop.plagin jQuery Mousewheel. Deci, un exemplu corectat. Vă mulțumim pentru că = observat)

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Nu-mi spune dacă este posibil să se facă ca browser-ul Skrpoll folosind DIV întinde la tot ecranul cu defilare, sunt tânăr în CSS este încă slab înțeles, nu ceea ce a experimentat poziționarea 3 zile nu a lăsat parcurgere a dispărut terci ajunge să folosească lățime și înălțime în% sau px

Mă întreb eu sunt o astfel de mult timp sau nu este posibil să se realizeze în CSS?

Vă mulțumim anticipat pentru răspunsul dumneavoastră.
-
Cu stimă Dmitry.

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Bine ai venit!
cum înțeleg întrebarea, aveți nevoie de o defilare regulat înseamnă css? atunci este necesar să se înregistreze dimensiunile containerului (înălțimea necesară) și overflow: scroll. toate

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

DIV
Înălțime: 98%; / * Inaltime * Unitate /
lățime: 99%; / * Lățime bloc * /
overflow: auto; / * Adăugați bara de derulare * /
padding-left: 15px; / * Offset din textul pe stânga * /
background-attachment: fix;
fundal: # 000000 / * culoare de fundal * /
URL-ul ( 'Fon-OPA-1.jpg') / * Calea către imaginea de fundal * /
fără repetare; / * Repetați fundalul vertical * /
>

BODY background-attachment: fix;
background-image: url ( '1.jpg'); / * Calea către imaginea de fundal * /
>

#layer stânga: 0px; / * Poziția marginii din stânga * /
top: 0px; / * Poziția marginii superioare * /
bottom: 0px; / * Distanta de la marginea de jos a ferestrei browser-ului * /
Poziția: absolută; / * Absolută de poziționare * /
padding: 7px; / * Câmpurile jurul textului * /
frontieră: solid 0px negru; / * * În parametrii /
>

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Iza nu a putut ajunge la ea folosind browserul Google Chrome?

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

care nu funcționează atunci? atașați dzheyskroll? sau fleksskroll?

Vă sfătuiesc să descărcați un exemplu de link-ul (cum ar fi prin intermediul „Salvați pagina“) și un eșantion personalizat pentru nevoile dumneavoastra. Uneori este mai ușor decât încercarea de a un exemplu de transfer la un alt cusatura

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

A vrut să facă pe pagina sa de defilare frumos, cu vedere - am găsit subiectul pentru o lungă perioadă de timp am lupta, dar este imposibil de a înlocui proiectarea scrollbar.
Dar eu nu înțeleg, funcționează cu activitatea in scufunzi în corpul nu funcționează? Nu știu!.
Descărcați un eșantion și a încercat să introducă la pagina lor, DVI pentru a întinde limitele browser-ului, care ar fi proiectarea trupei care a stat în exemplul de la locul unde trupa a browser-ului în sine ...
Aici este ceva ce am lupta ..
Aș fi recunoscător celor care vor explica cum de a deschide browser-ul Defilare banda.
Vă mulțumim anticipat.

Cu stimă, Dmitry!

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Bună ziua.
În primul rând vreau să vă mulțumesc pentru a conduce acest blog. Am citit câteva zile. Buna prezentare a informațiilor.

Și apoi întrebați: descărcați exemplul jScroll, totul funcționează. Încântæ.
Întrebarea este: în acest exemplu (ca, probabil, în altă parte), cursorul este scalat în funcție de tipul de cantitatea de informații în bloc.
Este posibil să vă asigurați că cursorul nu este schimbat (nu întindeți)?

Și am folosit dependența de întreaga lungime a barei de defilare la lungimea blocului?

Vă mulțumim anticipat pentru răspunsul dumneavoastră.

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Multe mulțumiri pentru revizuire!

Da, puteți! Nu-mi amintesc exact cum, dar dacă nu mă înșel, există posibilitatea de a seta lungimea minimă și maximă a cursorului, și în acest caz, ca unul sau celălalt parametru pentru a specifica același număr.

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Senks, vom continua să sape. )

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,





De ce suntem aici.



fotografie

oxi Sulimenko



Când voi vedea că carnea este umplut
unghiile nu găsesc doar unul din oraș!
Atenție, knackers și alte non-fani
animalele nu lasă în pace pe cei săraci
4 picioare! Fii atent ..





fotografie

Alexander Kuznetsov



Când voi vedea că carnea este umplut
unghiile nu găsesc doar unul din oraș!
Atenție, knackers și alte non-fani
animalele nu lasă în pace pe cei săraci
4 picioare! Fii atent ..


Marcajele, cum ar fi similar cu a ta), dar nu funcționează ..
Ea nu funcționează și pliz vse..pomogite! Foarte necesar la acest site Fitch)
două div'a pentru a posta clasă, și anume nevoia lor skrollit..vnutri div'a cu conținut id

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Ei bine, se pare, poate nu destul =)
sfat - atunci când unele script-ul nu reușește să se adapteze pentru a se potrivi realitățile lor, este necesar să se procedeze după cum urmează. ASSUME toate exemplele de cod și împinge oriunde te duci la pagina lor. în cazul în care lucrările - astfel încât totul este în regulă cu script-urile și trebuie doar să ia toate clasele și transferul la exemplul dumneavoastră. Dacă nu, începe prin verificarea conectarea bibliotecilor și zhkyuri versiune imaginind ceea ce ar putea fi cauza glafului.

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Vă mulțumim! Doar dreapta.

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Și am un conflict de versiuni de jquery
jquery-1.11.1.min.js și jquery-1.2.6.js

Acum funcționează sau pentru a defila sau glisorul

Am încercat să le muta, modifica ordinea de încărcare, nu ajută

Poate că există o versiune mai nouă în nota?

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

jscrollpane.kelvinluck.com
ea?
1.2.6 deja un dinozaur, este necesar pentru a ajunge la locul de muncă cu versiunea curentă a pluginului, bine, verificați plugin-ul cursorul pentru a lucra cu 1.10.2. În general, înainte! =)

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Alexander a câștigat de la 1.11 când ceilalți au luat. Pentru a derula site-ul script-uri jscrollpane.kelvinluck.com.

Înainte de aceasta, utilizați doar noua versiune a jQuery nu a ajutat

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Încă mai am pentru a derula pagina este în blocul care este ascuns inițial.
Și este necesar ca acesta a fost demonstrat pentru a declanșa un script pentru a derula,

Prin urmare, noi numim mai întâi script-ul fără $ (documentul) .ready
și apoi ascunde div, care este de a defila pe $ (documentul) .ready

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Am fost bucuros să vă ajute, păstrați-l în sus! =)

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Bună ziua, vă rugăm să prompte!
Cum putem realiza același buton animat, care arată că în partea de jos, de asemenea, au informația.
Ca acest site (ulovanet.ru)

Două modalități de a face div defilare verticală și orizontală și prin jQuery și nu numai,

Oleg, o zi bună.
Aici informații are kaptinlin.com/support/discussion/12265/revolution-sliders-scroll-down-button/p1
Această parte a Revoluției funcționale Slider.
Puteți face separat prin animație easein easeout, dar scripting aici abilități vor fi necesare.

articole similare