我从网上找了一个JS特效代码,效果是点击图片然后放大该图片,是仿FLASH效果的,现在我想改成是鼠标放上去就出来这种效果。代码如下,请告诉帮忙。(查看原来效果地址:http://www.codefans.net/jscss/code/24.shtml)<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Youtube图片切换特效</title>
<style type="text/css">
 html {
  overflow: hidden;
 }
 body {
  margin: 0px;
  padding: 0px;
  background: #000;
  width: 100%;
  height: 100%;
 }
 #imageFlow {
  position: absolute;
  width: 100%;
  height: 80%;
  left: 0%;
  top: 10%;
  background: #000;
 }
 #imageFlow .diapo {
  position: absolute;
  left: -1000px;
  cursor: pointer;
  -ms-interpolation-mode: nearest-neighbor;
 }
 #imageFlow .link {
  border: dotted #fff 1px;
  margin-left: -1px;
  margin-bottom: -1px;
 }
 #imageFlow .bank {
  visibility: hidden;
 }
 #imageFlow .top {
  position: absolute;
  width: 100%;
  height: 40%;
  background: #181818;
 }
 #imageFlow .text {
  position: absolute;
  left: 0px;
  width: 100%;
  bottom: 16%;
  text-align: center;
  color: #FFF;
  font-family: verdana, arial, Helvetica, sans-serif;
  z-index: 1000;
 }
 #imageFlow .title {
  font-size: 0.9em;
  font-weight: bold;
 }
 #imageFlow .legend {
  font-size: 0.8em;
 }
 #imageFlow .scrollbar {
  position: absolute;
  left: 10%;
  bottom: 10%;
  width: 80%;
  height: 16px;
  z-index: 1000;
 }
 #imageFlow .track {
  position: absolute;
  left: 1%;
  width: 98%;
  height: 16px;
  filter: alpha(opacity=30);
  opacity: 0.3;
 }
 #imageFlow .arrow-left {
  position: absolute;
 }
 #imageFlow .arrow-right {
  position: absolute;
  right: 0px;
 }
 #imageFlow .bar {
  position: absolute;
  height: 16px;
  left: 25px;
 }
</style>
</head>
<body>
 <div id="imageFlow">
  <div class="top"></div>
  <div class="bank">
   <a rel="http://preview.zcool.com.cn/code/js/04/1/ct37.jpg" title="Myselves" href="/">My identity lies in not knowing who I am</a>
   <a rel="http://preview.zcool.com.cn/code/js/04/1/ct60.jpg" title="Discoveries" href="/">...are made by not following instructions</a>
   <a rel="http://preview.zcool.com.cn/code/js/04/1/sf53.jpg" title="Nothing" href="/">...can come between us</a>
   <a rel="http://preview.zcool.com.cn/code/js/04/1/sf48.jpg" title="New life" href="/">Here you come!</a>
   <a rel="http://preview.zcool.com.cn/code/js/04/1/ct81.jpg" title="Optimists" href="/">They don't know all the facts yet</a>
   <a rel="http://preview.zcool.com.cn/code/js/04/1/ct134.jpg" title="Empathy" href="http://www.codefans.net/">Emotional intimacy</a>
   <a rel="http://preview.zcool.com.cn/code/js/04/1/ct41.jpg" title="Much work" href="http://www.codefans.net/">...remains to be done before we can announce our total failure to make any progress</a>
  </div>  <div class="text">
   <div class="title">Loading</div>
   <div class="legend">Please wait...</div>
  </div>
  <div class="scrollbar">
   <img class="track" src="http://preview.zcool.com.cn/code/js/04/1/sb.gif" alt="">
   <img class="arrow-left" src="http://preview.zcool.com.cn/code/js/04/1/sl.gif" alt="">
   <img class="arrow-right" src="http://preview.zcool.com.cn/code/js/04/1/sr.gif" alt="">
   <img class="bar" src="http://preview.zcool.com.cn/code/js/04/1/sc.gif" alt="">
  </div>
 </div>
</body>
</html>分少了一点,因为没分了!请见谅!

解决方案 »

  1.   

    JS代码地址:http://www.codefans.net/jscss/code/24.shtml
    谢谢
      

  2.   

    <a href="#" onmouseover="" onmouseout></a>onmouseover是鼠标移入事件在这里面改变图片的大小 onmouseout是鼠标移出事件在这里面变会原来的大小
      

  3.   

    可以,但原来的效果是鼠标点击后图片放大,再点放大的图片后进入连接页面。如果改成是ommouseover的话,鼠标移上去图片放大,再移到放大的图片上后就进入连接了。所以我想要的效果的
    鼠标移上去图片放大,再移到放大的图片上后要点击才能进入连接页面。
      

  4.   

    你不就是要像淘宝上面那种放大镜的效果吗?
    jquery直接就有这样的插件,你在百度输入jquery放大镜插件就可以
    我以前用过,很好用的
    这些都不用自己写的,而且自己写还涉及到浏览器不兼容的问题