微信小程序 圖片寬度自適應的實現(xiàn)
更新時間：2017年04月06日 17:12:27 投稿：lqh
這篇文章主要介紹了微信小程序 圖片寬度自適應的實現(xiàn)的相關資料,需要的朋友可以參考下
微信小程序 圖片寬度自適應的實現(xiàn)
實例代碼：
wxml 代碼：
<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
<block wx:for="{{imgUrls}}" wx:key="image">
<swiper-item>
<image src="{{item.image}}" model="aspectFit" style="width: {{imageWidth}}px;" bindload="imageLoad" />
</swiper-item>
</block>
</swiper>
JS 代碼：
imageLoad: function () {
this.setData({
imageWidth: wx.getSystemInfoSync().windowWidth,//圖片寬度
imgUrls: [
{ image: "http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg" },
{ image: "http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg" },
{ image: "http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg" }],
indicatorDots: false,//是否顯示圓點
autoplay: true,//自動播放
interval: 2000,//間隔時間
duration: 1000//監(jiān)聽滾動和點擊事件
})
}
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關文章
npm?start運行項目過程package.json字段詳解
這篇文章主要為大家介紹了npm?start運行項目過程package.json字段詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-02-02
實現(xiàn)一個簡單得數(shù)據(jù)響應系統(tǒng)
這篇文章主要介紹了實現(xiàn)一個簡單得數(shù)據(jù)響應系統(tǒng)，文章介紹的數(shù)據(jù)響應系統(tǒng)會用到Dep，其實，這就是一個依賴收集的容器， depend 收集依賴， notify 觸發(fā)依賴，下面來看看詳細的內容結介紹,需要的朋友可以參考一下2021-11-11
ResizeObserver 監(jiān)視 DOM大小變化示例詳解
這篇文章主要為大家介紹了ResizeObserver 監(jiān)視 DOM大小變化示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-10-10
這篇文章主要介紹了微信小程序 高德地圖詳解及簡單實例（源碼下載）的相關資料,需要的朋友可以參考下2017-01-01
JavaScript中document.activeELement焦點元素介紹
這篇文章主要給大家分享 JavaScript中document.activeELement焦點元素介紹，下面文章圍繞了document.activeElement屬性展開詳細內容,需要的朋友可以參考一下，希望對大家有所幫助2021-11-11
微信小程序page的生命周期和音頻播放及監(jiān)聽實例詳解
這篇文章主要介紹了微信小程序page的生命周期和音頻播放及監(jiān)聽實例詳解的相關資料,需要的朋友可以參考下2017-04-04
Three.js添加陰影和簡單后期處理實現(xiàn)示例詳解
這篇文章主要為大家介紹了Three.js添加陰影和簡單后期處理實現(xiàn)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-04-04
這篇文章主要為大家介紹了JS前端可視化canvas動畫原理及其推導實現(xiàn)，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08
這篇文章主要介紹了微信小程序 location API實例詳解的相關資料,需要的朋友可以參考下2016-10-10
這篇文章主要為大家介紹了使用yeoman打造自己的項目腳手架實現(xiàn)詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-03-03