html 笔记
图片墙循环代码:
<div id="lunbo" style="overflow:hidden;width:1350px;">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="lunbo1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="10" bordercolor="#FFFF99">
<tr align="center">
<td><img src="img/2008916212512987_2.jpg" width="300" height="470"></td>
<td><img src="img/W020080716457929217743.jpg" width="300" height="470"></td>
<td><img src="img/20150507142843_BS4cA.jpeg" width="300" height="470"></td>
<td><img src="img/ULVssF9HK_1300740737.jpg" width="300" height="470"></td>
<td><img src="img/p1099542477.jpg" width="300" height="470"></td>
<td><img src="img/5.jpg" width="300" height="470"></td>
</tr>
</table>
</td>
<td id="lunbo2" valign="top"></td>
</tr>
</table>
</div>
<script>
var speed=30//速度数值越大速度越慢
lunbo2.innerHTML=lunbo1.innerHTML
function Marquee(){
if(lunbo.scrollLeft<=0)
lunbo.scrollLeft+=lunbo2.offsetWidth
else{
lunbo.scrollLeft--
}
}
var MyMar=setInterval(Marquee,speed)
lunbo.onmouseover=function() {clearInterval(MyMar)}
lunbo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
标题滑动隐藏效果
<script type="text/javascript">
$(document).ready(function(){
$(".flip").click(function(){
$(".panel").slideToggle("slow");
});
});
</script>
<style type="text/css">
div.panel,p.flip
{
margin:0px;
padding:5px;
text-align:center;
background:#e5eecc;
border:solid 1px #c3c3c3;
}
div.panel
{
height:120px;
display:none;
}
</style>
</head>
<body>
<div class="panel">
<p>11111</p>
<p>11111</p>
</div>
<p class="flip">请点击这里</p>
阴影效果
box-shadow:0px -10px 15px #000000;
透明效果
opacity:0.8;