一个javascript特效解决办法

一个javascript特效

如图所示，写一个JS或JQ特效，Flash也行。点击右上角的图片跳转页面，点击下面的图片菜单切换当前DIV的背景图(图片从XML获取)，点击左右边的红色箭头可以移动焦点。

------解决方案--------------------
http://www.lanrentuku.com/js/jiaodiantu.html

------解决方案--------------------
http://download.****.net/detail/bkq421511585/4185335

用jquery 本来要分的我现在改成免费了，去看看吧
------解决方案--------------------

HTML code

<html>
<head>
<title>tab</title>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(function(){
    var banner_menu_li = $('.banner_menu li');        
    banner_menu_li.mouseover(function(){
        $(this).addClass('selected').siblings().removeClass('selected');
        var index = banner_menu_li.index(this);
        $('.banner_content div').eq(index).show().siblings().hide();
    });
});
</script>
<style type="text/css">
*{ 
    margin:0; 
    padding:0;
}
body{ 
    font:12px Verdana, Geneva, sans-serif; 
    padding:10px;
}
ul{
    list-style:none;
}
img{
    border:none;
}
.banner{
    border:1px solid #fc0; 
    background:#ff6; 
    width:800px; 
    height:150px; 
    position:relative; 
    overflow:hidden;
}
.banner_menu{
    position:absolute; 
    bottom:5px; 
    right:5px;
}
.banner_menu li{ 
    padding:0 5px; 
    height:18px; 
    line-height:18px; 
    border:1px solid #fc0; 
    float:left; 
    display:block; 
    margin-right:5px; 
    cursor:pointer;
}
</style>
</head>
<body>
<div class="banner">
    <div class="banner_menu">
        <ul>
            <li class="selected">1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    </div>
    <div class="banner_content">
        <div><a href="#"><img src="images/01.jpg" alt="图片一"/></a></div>
        <div><a href="#"><img src="images/02.jpg" alt="图片二"/></a></div>
        <div><a href="#"><img src="images/03.jpg" alt="图片三"/></a></div>
    </div>
</div>
</body>
</html>

------解决方案--------------------

可以参考一下这几个:
http://www.codefans.net/jscss/code/2214.shtml
http://www.codefans.net/jscss/code/2122.shtml
http://www.codefans.net/jscss/code/1049.shtml
直接运行即可。

一个javascript特效解决办法

相关推荐