欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

基于layui輪播圖滿屏是高度自適應(yīng)的解決方法

 更新時間：2019年09月16日 19:58:24   作者：魚之樂-子焉知  
今天小編就為大家分享一篇基于layui輪播圖滿屏是高度自適應(yīng)的解決方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

在做官網(wǎng)時，遇到輪播圖的問題，本來自己寫了個輪播圖，怎奈有個問題（當我打開頁面后去瀏覽其他頁面，回來首頁后會有圖片會來回閃動，沒有正確輪播）一直沒有解決。后來看到了layui插件的輪播圖，就拿過來用了，但是圖片高度不會自適應(yīng)，圖片變形。如圖：

解決辦法：

實例代碼：

 var b = 1920/460;//我的圖片比例
 //獲取瀏覽器寬度
 var W = $(window).width();
 var H = $(window).height();
 layui.use('carousel', function(){
  var carousel = layui.carousel;
  //建造實例
  carousel.render({
   elem: '#banner1'
   ,width: '100%' //設(shè)置容器寬度
   ,height: (W/b).toString()+"px" //按比例和瀏覽器可視頁面寬度來獲取高度
   ,arrow: 'always' //始終顯示箭頭
   //,anim: 'updown' //切換動畫方式
  });
 });
 
//窗口變化是重新加載
$(window).resize(function () {
 // setBanner();
 window.location.reload()
})

以上這篇基于layui輪播圖滿屏是高度自適應(yīng)的解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論