用html5、CSS3實現的超簡單幻燈片，用鼠標滾輪滾動進行換頁。
<!doctype html><html> <head> <title></title> <style> #slides{ position:absolute; left:0px; top:0px; height:100%; width:100%; overflow:hidden; } .slide{ position:absolute; height:600px; width:800px; opacity:0.7; background-color:rgba(0, 128, 196, 0.5) !important; background-color:#ccc; border-radius:10px; left:50%; top:50%; margin-top:-300px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.5); transition:all 0.25s ease-in-out 0s; } .current{ opacity:1; margin-left:-400px; } .future{ margin-left:450px; transform: skew(-3deg) scale(0.8); -webkit-transform: skew(-3deg) scale(0.8); } .post{ margin-left:-1250px; transform: skew(3deg) scale(0.8); -webkit-transform: skew(3deg) scale(0.8); } .far-future{ margin-left:1200px; transition:none; }
新聞熱點
疑難解答
