Dieses Mal bringe ich Ihnen jQuery, um einen vertikalen durchscheinenden Akkordeoneffekt zu erzeugen. Was sind die Vorsichtsmaßnahmen für jQuery, um einen vertikalen durchscheinenden Akkordeoneffekt zu erzeugen?
Operationsrendering:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery半透明抽屉式手风琴代码</title>
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;text-decoration:none;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";}
.pic{width:1100px;height:430px;margin:70px auto 0;}
.pic ul li{list-style:none;width:100px;height:429px;float:left;}
.pic .l1{background-image:url(img/1.jpg);}
.pic .l2{background-image:url(img/2.jpg);}
.pic .l3{background-image:url(img/3.jpg);}
.pic .l4{background-image:url(img/4.jpg);width:789px;}
.txt{width:100px; height:429px;background:#000;filter:alpha(opacity=50);background:rgba(0,0,0,.5);}
.txt p{color:#fff;font-family:"微软雅黑";float:left;position:relative;}
.txt .p1{font-size:12px;width:12px;margin:25px 25px 0 20px;}
.txt .p2{font-size:14px;width:14px;margin-top:25px;}
</style>
</head>
<body>
<p class="pic">
<ul>
<li class="l1">
<a href="//m.sbmmt.com" target="_blank">
<p class="txt">
<p class="p1">作者 ： 走天涯</p>
<p class="p2">我的个人拉萨之旅｜｜故事之城</p>
</p>
</a>
</li>
<li class="l2">
<a href="//m.sbmmt.com" target="_blank">
<p class="txt">
<p class="p1">作者 ： 走天涯</p>
<p class="p2">我的个人拉萨之旅｜｜故事之城</p>
</p>
</a>
</li>
<li class="l3">
<a href="//m.sbmmt.com" target="_blank">
<p class="txt">
<p class="p1">作者 ： 走天涯</p>
<p class="p2">我的个人拉萨之旅｜｜故事之城</p>
</p>
</a>
</li>
<li class="l4">
<a href="//m.sbmmt.com" target="_blank">
<p class="txt">
<p class="p1">作者 : 走天涯</p>
<p class="p2">我的个人拉萨之旅｜｜故事之城</p>
</p>
</a>
</li>
</ul>
</p>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(".pic ul li").hover(function(){
$(this).stop(true).animate({width:"789px"},500).siblings().stop(true).animate({width:"100px"},500);
});
</script>
</body>
</html>Jquery implementiert einen zufälligen Auswahlwechsel beim Öffnen der Seite
jQuery erzeugt einen responsiven Bildkarusselleffekt
Das obige ist der detaillierte Inhalt vonjQuery erzeugt einen vertikalen durchscheinenden Akkordeoneffekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
