效果见:http://www.xsborts.com/article/9e/2080.html
大家看看有什么问题?
我目前发现两个问题:
1.在IE下当鼠标在大图上时,左右箭头显示缓慢,如果快速移动鼠标到另一侧,箭头有时也不会快速变换,会有1-2秒的延时。我注意到IE下边有:正在下载xxxx鼠标文件的提示.FireFox下没有这个问题。
2.加载页面完成后,点第一张图片,有时会打开新窗口(这是不希望的),并单独显示这张图片。
这两个问题,还没找到解决办法,后来发现ifeng.com的图片浏览也有第一个问题的现象。你们有办法吗?
该javascript脚本在http://www.xsborts.com/hbcms/script/xsbortsImageBrowser.js
请大家分析下,也欢迎大家改动原脚本以优化之!
大家看看有什么问题?
我目前发现两个问题:
1.在IE下当鼠标在大图上时,左右箭头显示缓慢,如果快速移动鼠标到另一侧,箭头有时也不会快速变换,会有1-2秒的延时。我注意到IE下边有:正在下载xxxx鼠标文件的提示.FireFox下没有这个问题。
2.加载页面完成后,点第一张图片,有时会打开新窗口(这是不希望的),并单独显示这张图片。
这两个问题,还没找到解决办法,后来发现ifeng.com的图片浏览也有第一个问题的现象。你们有办法吗?
该javascript脚本在http://www.xsborts.com/hbcms/script/xsbortsImageBrowser.js
请大家分析下,也欢迎大家改动原脚本以优化之!
<tr>
<th height="110" width="600" bgcolor="#777777" scope="row" align="center" ><div id="imgSmallDiv" STYLE="position:relative; width:600px;overflow-x:auto; overflow-y:hidden;white-space:nowrap; font-size:0px; background:#999999" ><div id="imgSmallDivInner" style="position:relative;overflow:visible;white-space:nowrap;font-size:0px;background:#999999"></div>
</div></th>
</tr>
<tr >
<td align="center" id="imgBigTdDesc" ></td>
</tr>
<tr > <td align="center" id="imgBigTdX" height=300></td>
</tr>
</table><script language="javascript">
var imgBigDesc=new Array(
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/90/9059_100815202827.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/48/4849_100815202827.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/46/4621_100815202827.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/06/0608_100815202827.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/84/8467_100815202827.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/70/7082_100815202920.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/07/0700_100815202923.jpg" ],
["青奥会女足小组赛 伊朗队“全副武装”进球也疯狂" ,"http://www.xsborts.com/hbcms/upload/image/201008/big/12/1207_100815202923.jpg" ]
);
var urlLoading="http://www.xsborts.com/hbcms/image/loading.gif";
var urlLeftArrow="url(http://www.xsborts.com/hbcms/image/left.cur),auto";
var urlRightArrow="url(http://www.xsborts.com/hbcms/image/right.cur),auto";
var myImageBrowser=new xsbortsImageBrowser(imgBigDesc,"imgBigTdX","imgBigTdDesc","imgSmallDiv","imgSmallDivInner",urlLoading,urlLeftArrow,urlRightArrow);
myImageBrowser.insertSmallImg("myImageBrowser");
myImageBrowser.imgChangeToBig(imgBigDesc[0][1],imgBigDesc[0][0],0,"myImageBrowser");
var myScript=myImageBrowser.createScriptHead();
myScript+=myImageBrowser.createBigImgClick("myImageBrowser");
myScript+=myImageBrowser.createBigImgMouseMove("myImageBrowser");
myScript+=myImageBrowser.createBigImgMouseDown("myImageBrowser");
myScript+=myImageBrowser.createBigImgMouseUp("myImageBrowser");
myScript+=myImageBrowser.createAllSmallImgHover("myImageBrowser");
myScript+=myImageBrowser.createScriptTail();
$(myImageBrowser.jqBigImg).html(myScript);
</script>
其中有几个函数的参数是字符串myImageBrowser,这代表你创建的xsbortsImageBrowser的名字,xsbortsImageBrowser对象的参数含义请见脚本