提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其它

当前栏目

仿搜狐女人频道FLASH图片切换效果

图片 效果 切换 Flash 频道 搜狐 女人
2023-06-13 09:14:07 时间

JS图片切换:: *{margin:0;padding:0;} body{ margin:0; color:#88c;background:#333; } img{margin:0;padding:0;border:0;} #js_F{ position:relative; top:10px;left:10px; overflow:hidden; width:395px;height:185px; background:#33c; } .div_img{ position:absolute;top:0; width:295px;height:185px; cursor:pointer; } #div_img_0{z-index:5;left:0;} #div_img_1{z-index:4;left:25px;} #div_img_2{z-index:3;left:50px;} #div_img_3{z-index:2;left:75px;} #div_img_4{z-index:1;left:100px;}


这个是有一点问题的，就是鼠标在移动的图片上滑过时，图片会停顿一下，解决方法是增加一个图片位置标记：-1为左边；0为移动中；1为右边，也可以增加一个移动方向的参数，具体就懒得写了。下面再给一个自己写的图片切换效果：

JS图片切换:: *{margin:0;padding:0;} body{ margin:0; color:#88c;background:#333; } img{margin:0;padding:0;border:0;} #js_F{ position:relative; top:10px;left:10px; overflow:hidden; width:270px;height:185px; background:#33c; } #js_Fimg{ position:absolute; top:0;left:0; width:270px;height:185px; }

相关文章