jqeury仿flash图片联动标题效果
来源：互联网 发布：天猫淘宝助理 编辑：程序博客网 时间：2024/05/16 23:35
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>个性实用的新闻图片联动效果(一)</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<!--把下面代码加到之间-->
<style type="text/css">
a{display:block;font-size:15px;height:18px;line-height:18px;text-decoration:none;color:#333;font-family:Arial;font-size:12px; border-bottom:1px solid #aaa;}
.shell{float:left;border-left:1px solid #aaa;width:400px;padding:0px 2px 0px 20px;overflow:hidden;}
.core{height:190px;position:relative;overflow:hidden;}
#core-absolute{}
.imgBox{}
.imgBox img{width:400px;height:190px;padding:0;margin:0;display:block;}
</style>
</head>
<body>
说明：一轮结束后从头开始。<br><br>
<!--把下面代码加到<body>与</body>之间-->
<div class="imgBox" id="imgBox" style="height:190px;width:400px;overflow:hidden;float:left;">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
<img alt="jquery仿flash 个性实用的图片联动标题效果" src="#">
</div>
<div class="shell">
<div class="core">
<a href="javascript:">图片说明一</a>
<a href="javascript:">图片说明二</a>
<a href="javascript:">图片说明三</a>
<a href="javascript:">图片说明四</a>
<a href="javascript:">图片说明五</a>
<a href="javascript:">图片说明六</a>
<a href="javascript:">图片说明七</a>
<a href="javascript:">图片说明八</a>
<a href="javascript:">图片说明九</a>
<a href="javascript:">图片说明十</a>
<div id="core-absolute" style="position:absolute;z-index:2;width:400px;height:17px;border:1px solid #000;left:0;top:0px;"></div>
</div>
</div>
<script language="javascript">
function linkage(imgB,coreD,wtime){
var imgBox=document.getElementById(imgB);
var coreD=document.getElementById(coreD);
can=true;
coreD.onmouseover=function(){can=false};
coreD.onmouseout=function(){can=true}
var Max=parseInt(imgBox.scrollHeight/2);
new function(){
var Stop=parseInt(coreD.style.top)%19==0&&!can;
if(!Stop){
var x= parseInt(coreD.style.top);
x==171?(x=0,coreD.style.top=0+"px",imgBox.scrollTop=0):(imgBox.scrollTop+=10,x++,coreD.style.top=x+"px");
}
setTimeout(arguments.callee,parseInt(coreD.style.top)%19?10:wtime)
}
}
linkage("imgBox","core-absolute",3000);
</script>
</body>
</html>
- jqeury仿flash图片联动标题效果
- Javascript仿flash焦点图片效果
- Javascript仿flash焦点图片效果
- javascript 仿flash新闻图片切换效果－推荐
- javascript 仿flash新闻图片切换效果－推荐
- 纯js +css 仿flash 图片切换效果代码
- jQuery图片切换,轮播效果(仿迅雷首页FLASH效果)
- H5实现仿flash效果
- ViewPager+Tablayout实现页面标题联动效果
- 仿flash滚动播放图片
- jqeury 图片浏览
- 为周六JS活动聚会制作的效果之一：仿FLASH的图片轮换
- 可拖动FLASH+XML图片展示效果【点击放大带标题内容】
- 仿百度【图片显示效果】
- 仿百度图片浏览效果
- jqeury制作省市县三级联动控件
- Javascript 仿Flash 图片切换 及 Flash 图片切换(转)
- JavaScript仿flash焦点图片切换
- RPM命令手册
- Common Escape Character of URL
- Symbian OS简介
- Linux 中的汇编语言（四）
- zoj 3407 Doraemon's Cake Machine
- jqeury仿flash图片联动标题效果
- 飞秋2010 开发团队建设与管理的一些心得
- 创建windows计划任务
- oracle中使用job定时完成任务
- css+JavaScript实现水中倒影效果
- Authentication method password not supported by the server at this stage.
- Agg vs. Cairo 二维绘图引擎之比较和选择
- x86、i386、i486、i586、i686
- 报表工具软件参数强化之一
