求一个js插件。如下图所示，一个扫描，从所有tab上扫描过；如果tab报警，则扫描条变为报警的扫描效果。
1 回答
开心每一天1111
TA贡献1836条经验 获得超13个赞
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<style>
body{position: relative;}
div#content{height:500px;border:2px solid #f00;}
div#scan{height:500px;width:300px;position: absolute;;left:-100px;top:0px;
background: -webkit-linear-gradient(left,rgba(200,0,0,0),rgba(200,0,0,0.3)); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(right,rgba(200,0,0,0),rgba(200,0,0,0.3)); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(right,rgba(200,0,0,0),rgba(200,0,0,0.3)); /* Firefox 3.6 - 15 */
background: linear-gradient(to right,rgba(200,0,0,0),rgba(200,0,0,0.3)); /* 标准的语法 */
}
div#scan.yellow{
background: -webkit-linear-gradient(left,rgba(200,200,0,0),rgba(200,200,0,0.3)); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(right,rgba(200,200,0,0),rgba(200,200,0,0.3)); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(right,rgba(200,200,0,0),rgba(200,200,0,0.3)); /* Firefox 3.6 - 15 */
background: linear-gradient(to right,rgba(200,200,0,0),rgba(200,200,0,0.3)); /* 标准的语法 */
}
</style>
</head>
<body>
<div id="content" style="">
</div>
<div id="scan" style=""></div>
<script type="text/javascript">
$(function(){
$("#scan").animate({left:"+=1000px"},1000*20,"linear",function(){
$(this).css({left:"-100px"});
});
setInterval(function(){
$("#scan").animate({left:"+=1000px"},1000*20,function(){
$(this).css({left:"-300px"});
});
},1000*20);
setTimeout(function(){
$("#scan").addClass("yellow");
},3000)
})
</script>
</body>
</html>
@挺问中原 提供的答案我赞同，我就不写什么其他的想法了
添加回答
举报
0/150
提交
取消