1. 程式人生 > >swiper.js——一般屬性、進度屬性

swiper.js——一般屬性、進度屬性

奮鬥一般屬性

》direction:horizontal(預設)/vertical(垂直滑動)//slide滑動方向

》loop:true(預設)/false //可選選項,是否迴圈

》autoplay:具體時間ms//可選選項,自動滑動,其中實現反向自動滑動

setInterval("mySwiper.slidePrev()", 1000);

 

》autoplayDisableOnInteraction:true(預設)/false//使用者操作(包括觸碰,拖動,點選pagination等)swiper時,是否停止自動播放

》speed:具體時間ms//slider從開始到結束滑動的時間

》initialSlide://初始化時slide的索引

》grapCursor://滑鼠經過swiper時變成手狀,

》hashnav://類似錨點的功能,配合data-hash使用,當切換頁面是url會帶上data-hash裡的值,可用於切換時初始化顯示指定的頁面

 

》parallax:true/false(預設)//開啟視覺查效果,配合data-swiper-parallax(也可通過data-swiper-parallax-x或data-swiper-parallx-y單獨設),data-swiper-parallax-duration(背景移動經歷的時間,預設為speed)使用

 1. 對於swiper-container的子元素,視差效果

:背景隨之移動

 

2、對於slides的子元素,視差效果:背景不動,文字移動

》setWrapperSize:true/false(預設)//開啟這個設定會在Wrapper上新增等於slides相加的寬高,作用是相容不支援flexbox佈局的瀏覽器

》virtualTranslate:true/false(預設)//swiper除了不會移動外其他和平常都一樣,設定後可以自己定義slide的 移動效果。啟用這個選項時onSlideChange和onTransition事件失效。

width(height):具體值//強制Swiper的寬度,當你的Swiper隱藏狀態下初始化時

才用得上。這個引數會使自適應失效。其中width: window.innerWidthheight : window.innerHeight表設為全屏高寬

roungLength:true/false(預設)//設定為true將slide的寬和高取整(四捨五入)以防止某些解析度的螢幕上文字模糊。

slideOffsetBefore(slideOffsetAfter):具體數字//設定slide與左邊框(右邊框)的預設偏移量(單位px)

奮鬥進度屬性

watchSlideProgress:true/false(預設)//開啟這個引數來計算每個slide的progress(進度),Swiper的progress無需設定即開啟,一般與watchSlidesVisibility搭配使用

watchSlideVisibility:true/false(預設)//如果開啟了watchSlidesVisibility,則會在每個可見slide增加一個classname,預設為'swiper-slide-visible'。

相關推薦

swiper.js——一般屬性進度屬性

一般屬性 》direction:horizontal(預設)/vertical(垂直滑動)//slide滑動方向 》loop:true(預設)/false //可選選項,是否迴圈 》autoplay:具體時間ms//可選選項,自動滑動,其中實現反向自動滑動 setIn

js的本質全域性屬性

一、js的本質   1、js的本質就是處理資料,  資料來自於後臺資料庫,  所以變數就起到一個臨時資料的作用   Ecmascript 制定了js的資料型別   2、資料型別有哪些?     字串(string)、數字(number)、布林(Boolean)、空(null)、underfined、物

JavaScript面向對象(二)——成員屬性靜態屬性原型屬性JS原型鏈

清晰 property origin .com 所有 擴展方法 進入 https lock 前 言 上一篇博客(https://www.cnblogs.com/qdjianghao/p/10177360.html )中,我們介紹了JS中的面向對象,並詳細的解釋了this的

js 物件陣列新增屬性修改屬性

var kvArray = [{key: 1, value: 10}, {key: 2, value: 20}, {key: 3, value: 30}]; var reformattedArray = kvAr

JS面向物件(二)——成員屬性靜態屬性原型屬性JS原型鏈

前  言 上一篇部落格(https://blog.csdn.net/caseywei/article/details/86298732 )中,我們介紹了JS中的面向物件,並詳細的解釋了this的指向問題。本篇部落格,我們繼續來學習JS的面向物件。來深入理解一下JavaSc

js 物件動態新增屬性合併屬性

1、物件合併: var obj = {a:1, name: 'test'}; var shuxing = {name:"super",sex:"19",work:"IT"}; for(var r in

面向對象編程(實例屬性屬性)

else 統計學 顯示 刪除 self. 優先級 style 統計 IT 由於Python是動態語言,根據類創建的實例可以任意綁定屬性。 給實例綁定屬性的方法是通過實例變量,或者通過self變量: class Student(object): def __init

python全域性變數區域性變數&類屬性例項屬性

由於這幾個變數比較容易混淆,下面總結一下。 全域性變數: 在一個py檔案或者一個模組或者包中,但不在類中、不在函式內中的變數。 區域性變數 在函式內、在class的方法內(未加self修飾),這就是區域性變數 靜態變數/類變數 在class內的,但不在class的方法內

WPF UserControl 的繫結事件屬性附加屬性

原文: WPF UserControl 的繫結事件、屬性、附加屬性   WPF UserControl裡可供繫結的屬性 /// <summary> /// 重寫基類 Margin /// </summar

title屬性lang屬性hidden屬性

title屬性、lang、hidden屬性 滑鼠放上去會出提示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ti

面向物件-類屬性例項屬性

一、類屬性、例項屬性 1.類屬性 (1)類屬性就是類物件所擁有的屬性,它被所有類物件的例項物件所共有,在記憶體中只存在一個副本。對於公有的類屬性,在類外可以通過類物件和例項物件訪問   2.例項屬性(物件屬性) ① 程式碼: ② 結果: &nb

《隨筆七》——C#中的 “ 屬性 靜態屬性

目錄 屬性 使用屬性 利用 set 和 get  訪問器 執行其它運算 只讀和只寫屬性 屬性和公共欄位 自動實現屬性 靜態屬性 屬性 ●   屬性是代表類的例項或類中的一個數據項的成員。屬性指的是一組兩個匹配的、稱為訪

屬性例項屬性,靜態方法和類方法

類屬性、例項屬性 在瞭解了類基本的東西之後,下面看一下python中這幾個概念的區別 先來談一下類屬性和例項屬性 在前面的例子中我們接觸到的就是例項屬性(物件屬性),顧名思義,類屬性就是類物件所擁有的屬性,它被所有類物件的例項物件所共有,在記憶體中只存在一個副本,這個和C++中類的靜

集合去重 (集合元素為引用型別)--- java 8 新特性 --- 根據元素單屬性屬性實現去重

1. 程式碼寫法: (要求 JDK 1.8 或 1.8 以上) package gentle.entity; import lombok.Data; /** * * @author sile

JavaScript prototype 屬性和 物件屬性屬性的區別

在JavaScript中, 物件可以帶屬性,物件的原型(pototype)也可以帶屬性,類(Function物件)也可以帶屬性,那麼這些屬性有什麼區別呢? 1、實驗條件 首先宣告一個類 var my fun = function(){} (1)類的屬性 myfun.name

jQuery中的attr()與prop()設定屬性獲取屬性的區別

jQuery中的attr()與prop()設定屬性、獲取屬性的區別 一、checkbox的屬性設定選中或不選中 舉例,比如我們要獲取checkbox的屬性或者設定checkbox選中或不選

二十面向物件2— 隱藏屬性私有屬性私有方法__del__ 等四種如何使用測量物件的引用個數

一、隱藏屬性 在一個方法裡面去規範傳遞的屬性值。(更安全),為每一個屬性新增set   get 方法 二、私有屬性 1、在外部使用私有成員的名字時,會提示找不到。 2、例如self.__

Python中的類屬性例項屬性與類方法靜態方法

1、什麼是類物件,例項物件 類物件:類名 例項物件:類建立的物件 2、類屬性就是類物件所擁有的屬性,它被所有類物件的例項物件所共有,在記憶體中只存在一個副本,這個和C++、Java中類的靜態成員變數有點類似。對於公有的類屬性,在類外可以通過類物件和例項物件訪問 類屬性 #

表格標籤標籤屬性樣式屬性總結

目標:總結表格標籤及標籤屬性,設定表格樣式 PS:表單的用途是收集使用者資料,而表格的用途則是以網格的形式向用戶顯示二維資料 一、表格標籤 理論上只需要table、tr、td就可以達到目的,但是為了結構更加清晰明確,達到語義化

【2017-05-21】WebForm跨頁面傳值取值C#服務端跳轉頁面 Button的OnClientClick屬性Js中getAttribute和超鏈接點擊彈出警示框。

代碼 height delet update size 內存 客戶 bar win 一、跨頁面傳值和取值: 1、QueryString - url傳值,地址傳值 優缺點:不占用服務器內存;保密性差,傳遞長度有限。 通過跳轉頁面路徑進行傳值,方式: href="地址?ke