Opera Extension [Chinese Speed Dial]

最新推荐文章于 2024-09-22 11:17:00 发布

CashLee

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量1.8k

点赞数

分类专栏： JAVASCRIPT 文章标签： opera extension border function javascript xhtml

本文链接：https://blog.csdn.net/lbj96347/article/details/6337505

版权

JAVASCRIPT 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

这个是我做的Chinese Speed Dial。这个是Opera浏览器的拓展。这个拓展的功能在于降低Opera Speed Dial数量不足的尴尬。有些时候也许你把自己感兴趣的网站都收藏在了你的Speed Dial上面，然后有一些很有实用性的网站却没有地方放置了。这样的话这个小拓展就可以帮到你了，因为我收藏了我们国内网民比较喜欢的一些网站以及实用的网站上面，这样的话您就可以在上面更轻松地浏览网页了。

当然功能还不够完善，具体的一些代码就在下面了。我非常希望大家提一些建议给我，让我的这个拓展做得更好，目前这个拓展正在Opera官方网站上面测试者，不知道要等多久。好了的话，我会在我的新浪微博上面和大家分享的：【微博】

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Chinese Speed Dial</title>
<base target="_blank">
<style>
*{margin:0;padding:0;border:0;list-style:none;}
body{font:12px Verdana, Geneva, sans-serif;line-height:18px;color:#333;}
a{text-decoration:none;color:#004285;font-size:14px;font-weight:bold;}
a:hover{text-decoration:underline;color:#C33;}
.rig{border:1px solid #dedede;width:750px;margin-bottom:5px;position:relative;background:#fff;}
#qy a{font-size:12px;}
h5 span a{font-size:12px;font-weight:normal;color:#333;}
h5{padding:0 10px;font-size:11px;height:30px;line-height:30px;background:url(/upload/201005/20100530223157155.jpg?1259835263) left center repeat-x;border-bottom:1px solid #dedede;}
span{float:right;}
</style>
</head>
<body>
<div class="rig">
<h5><span><a href="http://t.sina.com.cn/lbj96347">Powered by CashLee</a></span>Chinese Speed Dial</h5>
<div id="qy" style="width:720px;margin:7px 10px 5px;height:140px;overflow:hidden" onMouseOver="qiScrollAmount=0"
οnmοuseοut="qiScrollAmount=2">
<ul>
<li id="tab1">
<table border='0' cellspacing='0' cellpadding='0' width='720px'>

<tr>
<td><a href="http://t.sina.com.cn/" target="_blank"><img src="logoimg/sina1.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.renren.com/" target="_blank"><img src="logoimg/renren.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.qqzone.com/" target="_blank"><img src="logoimg/qqzone.png" width="140" height="140" /></a></td>
<td><a href="http://www.diandian.com/" target="_blank"><img src="logoimg/diandian.png" width="140" height="140" border="0px" /></a></td>
<td><a href="http://t.qq.com/" target="_blank"><img src="logoimg/tencent.png" width="140" height="140" border="0px"/></a></td>
</tr>


<tr>
<td><a href="http://www.ccb.com/" target="_blank"><img src="banklogo/ccb.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.abchina.com/" target="_blank"><img src="banklogo/abc.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.boc.cn/" target="_blank"><img src="banklogo/cbn.png" width="140" height="140" /></a></td>
<td><a href="http://www.icbc.com.cn/" target="_blank"><img src="banklogo/icbc.png" width="140" height="140" border="0px" /></a></td>
<td><a href="http://www.alipay.com/" target="_blank"><img src="banklogo/alipay.png" width="140" height="140" border="0px"/></a></td>
</tr>

<tr>
<td><a href="http://www.taobao.com/" target="_blank"><img src="shoplogo/taobao.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.joyo.com/" target="_blank"><img src="shoplogo/joyo.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.360buy.com/" target="_blank"><img src="shoplogo/360buy.png" width="140" height="140" /></a></td>
<td><a href="http://www.dangdang.com/" target="_blank"><img src="shoplogo/dangdang.png" width="140" height="140" border="0px" /></a></td>
<td><a href="http://www.vancl.com/" target="_blank"><img src="shoplogo/vancl.png" width="140" height="140" border="0px"/></a></td>
</tr>

<tr>
<td><a href="http://www.xunlei.com/" target="_blank"><img src="videoLogo/xunlei.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.yinyuetai.com/" target="_blank"><img src="videoLogo/yinyuetai.png" width="140" height="140" border="0px"/></a></td>
<td><a href="http://www.verycd.com/" target="_blank"><img src="videoLogo/verycd.png" width="140" height="140" /></a></td>
<td><a href="http://www.tudou.com/" target="_blank"><img src="videoLogo/tudou1.png" width="140" height="140" border="0px" /></a></td>
<td><a href="http://www.youku.com/" target="_blank"><img src="videoLogo/youku1.png" width="140" height="140" border="0px"/><a></td>
</tr>





</table>
</li>
<li id="tab2"></li>
</ul>
</div>
<style>
#btm{position:absolute;right:0;top:70px;width:12px;height:140px; no-repeat;overflow:hidden;}
#btm a{display:block;height:30px;}
#btm a#up:hover{ -3px -10px no-repeat;}
#btm a#dw:hover{ -3px -25px no-repeat;}
</style>
<div id="btm"><a></a><a id="up" οnclick="up()" href="javascript:;" target="_self">↑</a><a id="dw" οnclick="dw()" href="javascript:;" target="_self">↓</a></div>



<script>
var qoMarquee = document.getElementById("qy"); //滚动对象
var tab1 = document.getElementById("tab1");
var tab2 = document.getElementById("tab2");
var qiLineHeight = 140;//单行高度，像素IE
var qiLineCount = 0; //实际行数
var qiScrollAmount = 2; //每次滚动高度，像素（速度）
var speed1=3500;//每次停留时间
var speed2=1;//滚动速度
var num=qoMarquee.getElementsByTagName('img').length;//总数
tab2.innerHTML=tab1.innerHTML;
var alink=document.getElementById('btm').getElementsByTagName('a');
for(var i=0;i<alink.length;i++){
alink[i].οnfοcus=function(){this.blur();}
}
function run() {
if(qoMarquee.scrollTop==num*qiLineHeight){qoMarquee.scrollTop=0;window.setTimeout( "run()", speed2 );}//重置并接着滚动
else{
qoMarquee.scrollTop +=qiScrollAmount;
if ( qoMarquee.scrollTop % qiLineHeight == 0 ) {window.setTimeout( "run()", speed1 );}//如果满格等待N秒
else {window.setTimeout( "run()", speed2 );}//正常滚动
}
}
function up(){
qiScrollAmount = 0;
var amount=1;
if(qoMarquee.scrollTop==num*qiLineHeight) qoMarquee.scrollTop=0;
qoMarquee.scrollTop +=amount;
if ( qoMarquee.scrollTop % qiLineHeight == 0 ) {amount=0;window.setTimeout( "qiScrollAmount = 2", speed1 );}
else window.setTimeout( up(), 1 );
}
function dw(){
qiScrollAmount = 0;
var amount=1;
if(qoMarquee.scrollTop==0) qoMarquee.scrollTop=num*qiLineHeight;
qoMarquee.scrollTop -=amount;
if ( qoMarquee.scrollTop % qiLineHeight == 0 ) {amount=0;window.setTimeout( "qiScrollAmount = 2", speed1 );}
else window.setTimeout( dw(), 1 );
}
window.setTimeout( "run()", speed1 );
</script>


</div>
</body>
</html>