相连处无边框的效果可以通过层叠和浮动来实现,只要左侧内容向右"压"去一个边框的位置,就可将右侧的边框隐去.
用什么标签并不重要,都能实现.
如果你想只向一移的话，你需要修改translate-webkit-transform:translatey(100px)
-moz-transform:translatey(100px)这样才是向下移动100px，
因为translate
默认是移动xy轴的，意思就是说，移动左右以及上下一起，但是默认平移而已，
如果你想单独 *** 作y的话，就要translatey，单独 *** 作x用translatex，当然默认translate
(100px)相当于translatex(100px)
如果你想向右移的同时又向下移
-webkit-transform:translate(100px,100px)
-moz-transform:translate(100px,100px)这样你应该能理解translate的用法
了。。。
9天的页面是用到了ShowMan这个js函数，该函数实时调用ajax/idx2009/StrongMan.aspx的这个页面，查询返回最新的内容，调用到标签中。
不过如果想简单点，可以制作3个宽的div，3个窄的div，运用onmouseover时间互相交替显示。
简单示例：<html>
<body>
<script>function mousemoveShowDiv(tShowid){
for(i=1i<=3i++){if(tShowid==i){document.getElementById("dadiv" + i).style.display='inline'document.getElementById("xiaodiv" + i).style.display='none'}else{document.getElementById("dadiv" + i).style.display='none'document.getElementById("xiaodiv" + i).style.display='inline'}}
}</script>
<div style="border:1px solid blakwidth:710pxheight:210px">
<div id="xiaodiv1" onmouseover="mousemoveShowDiv(1)" style="display:noneborder:1px solid #7DD5FFwidth:150pxheight:200pxfloat:leftfont-size:14px">小div1内容</div>
<div id="dadiv1" style="border:1px solid #7DD5FFwidth:400pxheight:200pxfloat:leftfont-size:26px">大div1内容</div>
<div id="xiaodiv2" onmouseover="mousemoveShowDiv(2)" style="border:1px solid #FF7575width:150pxheight:200pxfloat:leftfont-size:14px">小div2内容</div>
<div id="dadiv2" style="display:noneborder:1px solid #FF7575width:400pxheight:200pxfloat:leftfont-size:26px">大div2内容</div>
<div id="xiaodiv3" onmouseover="mousemoveShowDiv(3)" style="border:1px solid #9DFF9Dwidth:150pxheight:200pxfloat:leftfont-size:14px">小div3内容</div>
<div id="dadiv3" style="display:noneborder:1px solid #9DFF9Dwidth:400pxheight:200pxfloat:leftfont-size:26px">大div3内容</div>
</div>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）