搜尋

首頁  >  文章  >  web前端  >  用box固定長寬實作圖片自動輪播js程式碼_javascript技巧

用box固定長寬實作圖片自動輪播js程式碼_javascript技巧

WBOY
WBOY原創
2016-05-16 16:45:181306瀏覽

這個小DEMO，主要用box固定長寬用來顯示圖片，將圖片放入imagebox中，連接起來，每次換圖片則將imagebox的style屬性的margin-left改動，能形成輪播的效果。

複製程式碼 代碼如下:

-/html/PUBL "IC DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



無標題文件 <br><style> <BR>.box { <BR>width: 900px; <BR>height: 350px; <BR>margin: 20px; <BR>overflow: hidden; <BR>margin: 20px; <BR>overflow: hidden;; ; <BR>} <BR>.imagebox { <BR>width: 3600px; <BR>height: 350px; <BR>-webkit-transition: all 1s ease-in-out; <BR>-moz-transition: 1s ease-in-out; <BR>-o-transition: all 1s ease-in-out; <BR>transition: all 1s ease-in-out; <BR>} <BR>.imagebox img { <BR> width: 900px; <BR>float: left; <BR>height: 350px; <BR>} <BR></style> <br> <br><br>


用box固定長寬實作圖片自動輪播js程式碼_javascript技巧
用box固定長寬實作圖片自動輪播js程式碼_javascript技巧
用box固定長寬實作圖片自動輪播js程式碼_javascript技巧
用box固定長寬實作圖片自動輪播js程式碼_javascript技巧








陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
上一篇：JavaScript利用正規表示式去除日期中的-_javascript技巧下一篇：JavaScript利用正規表示式去除日期中的-_javascript技巧

相關文章

看更多