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 để WorldWideScripts.net

Đăng ký vào nguồn cấp dữ liệu của chúng tôi để ở lại đến ngày!

Mới! Theo chúng tôi như bạn muốn nó!


Full Width Slider 2 - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Full Width Slider 2 là dễ dàng để sử dụng jQuery hình ảnh thanh trượt tối ưu hóa cho toàn bộ chiều rộng màn hình.

Tính năng

- JQuery hướng.
- Thiết kế đáp ứng.
- Có thể điều chỉnh tốc độ chuyển tiếp.
- Auto slideshow với tạm ngừng trên di chuột.
- Tương thích với tất cả các trình duyệt chính (IE8 trở lên, Chrome, Firefox, Safari và Opera)
- Có thể thêm tiêu đề, mô tả và nút liên kết cho mỗi slide.

Phương pháp mới:

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

Các tùy chọn mới:

 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

Ví dụ với tất cả các thiết lập:

 <script type = "text / javascript"> $ (document).ready (function () { // Tạo dụ nắp trượt mới var my_slider = $ ('. Ví dụ') fws2 (.); // Thiết lập cài đặt thanh trượt (tùy chọn) Bạn hoàn toàn có thể bỏ qua khối này my_slider.settings ({ cs: 0, // trượt hiện tại; 0 - đầu tiên, 1 - thứ hai, vv... Độ dài: 750, // thời gian trượt; mili giây hoverpause: 1, // Tạm dừng trên di chuột; 1 - Có, 0 - Không có tạm dừng: 6000, // Tạm dừng trước khi đi đến slide tiếp theo; mili giây mũi tên: 1, // Hiển thị mũi tên; 1 - Có, 0 - Không có đạn: 0, // Display đạn; 1 - Có, 0 - Không có expandDuration: 750, // Hiển thị mũi tên; 1 - Có, 0 - Không có linktext: "Read More", // Button Text (thiết lập toàn cầu) // Tùy chọn nâng cao titleHTML: '<h4>% title% </ h4>', // HTML tùy biến cho Tiêu đề descriptionHTML: '<p>% desc% </ p>', // HTML tùy biến cho các Mô tả linkHTML: '<a href="%link%">% linktext% </a>', // HTML tùy biến cho nút liên kết beforeInit: function () {}, // Function để chạy trước khi trượt init afterInit: function () {}, // Function để chạy sau khi trượt init slideStart: function (slide) {}, // Function để chạy trên slide đầu, trả về đối tượng trượt slideEnd: function (slide) {} // hàm để chạy trên slide cuối, trả về đối tượng trượt }); // Thêm trượt my_slider.addSlide ({ hình ảnh: "img / slide_1.jpg ', // nguồn ảnh tiêu đề: 'Slide 1', // Tiêu đề Mô tả: 'mô tả', // trượt Mô tả linktext: '', // Button Text (Tùy chọn, sẽ sử dụng các thiết lập toàn cầu khác) link: 'http: // trang web' // Đọc thêm link URL }); // Bắt đầu thanh trượt my_slider.start (); }); </ script> 

Ví dụ ngắn mà không biến, sử dụng chain:

 <script type = "text / javascript"> $ (document).ready (function () { $ ('. example1') .fws2 ({đạn: 1, mũi tên: 0}) .addSlide ({image: "img / slide_1.jpg ', tiêu đề:' Slide 1 ', mô tả:' mô tả ', liên kết:' http: // trang web '}) .addSlide ({image: "img / slide_2.jpg ', tiêu đề:' Slide 2 ', mô tả:' mô tả ', liên kết:' http: // trang web '}) .addSlide ({image: "img / slide_3.jpg ', tiêu đề:' Slide 3 ', mô tả:' mô tả ', liên kết:' http: // trang web '}) .bắt đầu(); }); </ script> 

Ví dụ sử dụng chức năng gọi lại

 <script type = "text / javascript"> $ (document).ready (function () { var example_slider = $ ('. Ví dụ 2') fws2 (.); example_slider.settings ({ afterInit: function () { alert ('Slider sẵn sàng!'); }, slideEnd: function (slide) { var title = slide.find ("title"). text (). alert ('này là' + tiêu đề); } }); example_slider.addSlide ({image: "img / slide_1.jpg ', tiêu đề:' Slide 1 ', mô tả:' mô tả ', liên kết:' http: // trang web '}); example_slider.addSlide ({image: "img / slide_2.jpg ', tiêu đề:' Slide 2 ', mô tả:' mô tả ', liên kết:' http: // trang web '}); example_slider.addSlide ({image: "img / slide_3.jpg ', tiêu đề:' Slide 3 ', mô tả:' mô tả ', liên kết:' http: // trang web '}); example_slider.start (); }); </ script> 

Ví dụ tùy HTML

 <script type = "text / javascript"> $ (document).ready (function () { var example_slider = $ ('. example4') fws2 (.); example_slider.settings ({ titleHTML: '<h1> <a href="%link%">% title% </a> </ h1>', descriptionHTML: '<p> <i class = "fa fa-kiểm tra" /> <span>% desc% </ span> </ p>', linktext: 'Đọc thêm', linkHTML: '<a href="%link%">% linktext% về% title% </a>' }); example_slider .addSlide ({image: "img / slide_1.jpg ', tiêu đề:' Slide 1 ', mô tả:' mô tả ', liên kết:' http: // trang web '}) .addSlide ({image: "img / slide_2.jpg ', tiêu đề:' Slide 2 ', mô tả:' mô tả ', liên kết:' http: // trang web '}) .addSlide ({image: "img / slide_3.jpg ', tiêu đề:' Slide 3 ', mô tả:' mô tả ', liên kết:' http: // trang web '}) .bắt đầu(); }); </ script> 

Ở lại đến ngày!

Thực hiện theo chúng tôi trên Facebook hoặc Twitter và nhận được tin tức mới nhất về bản cập nhật và bổ sung mục sắp tới và các kịch bản!

Bạn cũng có thể theo chúng tôi trên Instagram và sớm trên YouTube với video hướng dẫn về cách cài đặt plugin và các kịch bản của chúng tôi!

Changelog

08 tháng 12 năm 2015

- Mã Javascript đã được viết lại.
- Imagesloaded.js kịch bản bây giờ là tùy chọn.
- HTML đã được gỡ bỏ. Nó bây giờ hoàn toàn xây dựng từ javascript.
- Liên kết chữ Google được lấy ra từ đầu khi nó không còn được sử dụng.
- Slider doanh nghiệp được khởi tạo bằng cách sử dụng $ (selector).fws2 ();

- Các phương pháp mới:

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

- Các tùy chọn mới:

 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

Tháng Tư 10, 2014

- Slider bây giờ hỗ trợ nhiều trường hợp trên trang.
- Thêm đạn chuyển hướng.
- Arrow / Bullets hướng có thể được bật ON / OFF bây giờ.
- Thêm tùy chọn để vô hiệu hóa autoslide dừng trên mouseover.
- Slider bây giờ sử dụng font-tuyệt vời thay vì hình ảnh cho các mũi tên điều hướng và đạn.
- Thêm bàn phím trái / phải chuyển hướng mũi tên.


Tải về
Các thành phần khác trong thể loại nàyTất cả các thành phần của tác giả này
Ý kiếnCâu hỏi thường gặp và câu trả lời

Tài sản

Tạo:
16 Tháng Mười Một 12

Cập nhật cuối cùng:
08 Tháng Mười Hai 15

Độ phân giải cao:
Vâng

Các trình duyệt tương thích:
IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome

Bao gồm các tập tin:
JavaScript JS, HTML, CSS

Phiên bản phần mềm:
jQuery

Từ khóa

Thương mại điện tử, Thương mại điện tử, Tất cả mó, n đồ, đầy, javascript, jquery, js, đá, p lại, thanh trượt, trì, nh chiếu, bề rộng