WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Sliders

Full Width Slider 2

— Add-on al WorldWideScripts.net

Abonu al nia feed resti ĝisdata!

Nova! Sekvu nin kiel vi deziras gxin!


Full Width Slider 2 - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Plena Larĝeco Slider 2 estas facile uzi jQuery bildo slider optimumigita por tutekrana larĝa.

Karakterizaĵoj

- JQuery pelataj.
- Respondema dezajno.
- Adjustable transiro rapido.
- Aŭtomata slideshow kun paŭzo en ŝvebado.
- Kongrua kun ĉiuj grandaj retumiloj (IE8 kaj pli, Chrome, Firefox, Safaro kaj Opero)
- Povas aldoni Titolo, Priskribo kaj Link prembutonon ĉiu ŝtono.

Novaj Metodoj:

addSlide - Adds slide to the slider 
start - Starts the slider
restart - Restart the slider
destroy - Remove the slider

Novaj ebloj:

 cs - Current slide; 0 - first, 1 - second etc... 
expandDuration - Initial height animation duration, milliseconds
linktext - Button Text
titleHTML - Custom HTML for the Title (ex. <h4>%title%</h4> )
descriptionHTML - Custom HTML for the Description (ex. <p>%desc%</p> )
linkHTML – Custom HTML for the link button (ex. <a href="%link%">%linktext%</a> )
beforeInit – Function to run before slider init
afterInit – Function to run after slider init
slideStart – Function to run on slide start, returns the slide object
slideEnd – Function to run on slide end, returns the slide object

Ekzemplo kun ĉiuj difinoj:

 <script type = "text / javascript"> $ (dokumento).ready (funkcio () { // Krei novan slider ekzemple var my_slider = $ ('. Ekzemple'). fws2 (); // Ŝanĝu slider agordojn (laŭvola) Vi povas tute ignori tiun blokon my_slider.settings ({ cs: 0, // Nuna slide; 0 - unua, 1 - dua ktp... daŭro: 750, // Slide daŭro; milisekundoj hoverpause: 1, // Paŭzi en ŝvebado; 1 - Jes, 0 - Neniu paŭzi: 6000, // Paŭzi antaŭ iri al proksima glito; milisekundoj sagoj: 1, // Vidigu sagoj; 1 - Jes, 0 - Neniu kugloj: 0, // Vidigu kugloj; 1 - Jes, 0 - Neniu expandDuration: 750, // Vidigu sagoj; 1 - Jes, 0 - Neniu linktext: 'Read More', // Buton Teksto (Tutmonda fikso) // Altnivelaj opcioj titleHTML: '<h4>% titolo% </ h4>', // Propra HTML por la Titolo descriptionHTML: '<p>% desc% </ p>', // Propra HTML por la priskribo linkHTML: '<a href="%link%">% linktext% </a>', // Propra HTML por la ligilo butono beforeInit: funkcio () {}, // Funkcio kuri antaŭ slider init afterInit: funkcio () {}, // Funkcio kuri post slider init slideStart: funkcio (tobogano) {}, // Funkcio kuri sur tobogano komenco, revenas la glito objekto slideEnd: funkcio (tobogano) {} // Funkcio kuri sur tobogano fino, revenas la glito objekto }); // Aldonante glito my_slider.addSlide ({ bildo: 'img / slide_1.jpg', // Bildo fonto title: 'Slide 1', // Titolo priskribo: 'priskribo', // Slide Priskribo linktext: '', // Buton Teksto (Laŭvola, uzos la tutmonda agordojn alie) ligilo: http: // retpaĝaro '// Legi Pli URL ligilon }); // Kreu la slider my_slider.start (); }); </ script> 

Mallonga ekzemplo sen variablo, uzante sinsekvon:

 <script type = "text / javascript"> $ (dokumento).ready (funkcio () { $ ('. example1') .fws2 ({kugloj: 1, sagoj: 0}) .addSlide ({bildo: 'img / slide_1.jpg', title: 'Slide 1', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}) .addSlide ({bildo: 'img / slide_2.jpg', title: 'Slide 2', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}) .addSlide ({bildo: 'img / slide_3.jpg', title: 'Slide 3', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}) .start (); }); </ script> 

Ekzemplo uzante callback funkcio

 <script type = "text / javascript"> $ (dokumento).ready (funkcio () { var example_slider = $ ('. example2'). fws2 (); example_slider.settings ({ afterInit: funkcio () { garde ('Slider preta!'); }, slideEnd: funkcio (tobogano) { var titolo = slide.find ("." titolo). text (); garde ('tio estas' + titolo); } }); example_slider.addSlide ({bildo: 'img / slide_1.jpg', title: 'Slide 1', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}); example_slider.addSlide ({bildo: 'img / slide_2.jpg', title: 'Slide 2', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}); example_slider.addSlide ({bildo: 'img / slide_3.jpg', title: 'Slide 3', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}); example_slider.start (); }); </ script> 

Ekzemplo agordigo HTML

 <script type = "text / javascript"> $ (dokumento).ready (funkcio () { var example_slider = $ ('. example4'). fws2 (); example_slider.settings ({ titleHTML: '<h1> <a href="%link%">% titolo% </a> </ h1>', descriptionHTML: '<p> <i class = "fa fa-kontroli" /> <span>% desc% </ span> </ p>', linktext: 'Legu pli', linkHTML: '<a href="%link%">% linktext% pri% titolo% </a>' }); example_slider .addSlide ({bildo: 'img / slide_1.jpg', title: 'Slide 1', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}) .addSlide ({bildo: 'img / slide_2.jpg', title: 'Slide 2', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}) .addSlide ({bildo: 'img / slide_3.jpg', title: 'Slide 3', priskribo: 'priskribo', ligilo: http: // retpaĝaro '}) .start (); }); </ script> 

Resti ĝisdata!

Sekvu nin je FacebookTwitter kaj akiri novaĵojn pri ero ĝisdatigoj kaj okazontaj kromaĵojn kaj skriptoj!

Vi ankaŭ povas sekvi nin sur Instagram kaj poste sur YouTube kun video lernilojn pri kiel instali kromprogramojn kaj niaj skriboj!

Changelog

Decembro 8, 2015

- JavaScript kodo estis rewriten.
- Imagesloaded.js skripto estas nun laŭvola.
- HTML estas forigita. Ĝi nun estas tute konstruu de la javascript.
- Google tiparo ligilo estas forigita de la kapo kiel estas ne plu uzata.
- Slider nun pravalorizitaj uzante $ (elektilo).fws2 ();

- Novaj Metodoj:

 addSlide - Adds slide to the slider 
start - Starts the slider
restart - Restart the slider
destroy - Remove the slider

- Novaj ebloj:

 cs - Current slide; 0 - first, 1 - second etc... 
expandDuration - Initial height animation duration, milliseconds
linktext - Button Text
titleHTML - Custom HTML for the Title (ex. <h4>%title%</h4> )
descriptionHTML - Custom HTML for the Description (ex. <p>%desc%</p> )
linkHTML – Custom HTML for the link button (ex. <a href="%link%">%linktext%</a> )
beforeInit – Function to run before slider init
afterInit – Function to run after slider init
slideStart – Function to run on slide start, returns the slide object
slideEnd – Function to run on slide end, returns the slide object

Aprilo 10, 2014

- Slider nun subtenas plurajn petskribojn sur la paĝo.
- Aldonita kugloj navigado.
- Arrow / Kugloj navigado povas esti ŝaltita / OFF nun.
- Aldonita eblo malaktivigi autoslide halto sur mouseover.
- Slider nun uzas font-awesome anstataŭ bildoj por la navigado sagoj kaj kugloj.
- Aldonita klavaro lasita / rajton sago navigado.


Elŝuti
Aliaj komponantoj en ĉi tiu kategorioĈiuj komponantoj de tiu aŭtoro
KomentojOftaj demandoj kaj respondoj

Propraĵoj

Kreita:
16 Novembro 12

Lasta Ĝisdatigo:
8 Decembro 15

Alta Rezolucio:
Jes

Kongrua Browsers:
IE8, IE9, IE10, IE11, Firefox, Safari, Opero, Chrome

Dosieroj Inkluditaj:
JavaScript JS, HTML, CSS

Programaro Versio:
jQuery

Ŝlosilvortoj

eCommerce, eCommerce, Ĉiuj Eroj, plena, Javaskripto, jQuery, js, respondemaj, slider, bildoprezento, larĝo