鼠标移动时缩小图片显示说明 

<!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>
<title>jQuery Zoom-Info - AddyOsmani.com</title>

<link rel="stylesheet" type="text/css" href="css/style.css"></link>
<style>

.galleryContainer {width: 1024px;}
.galleryImage { background-color:black; width:325px; height:260px; overflow:hidden; margin:5px; float:left;}
.info    { margin-left:10px; font-family:arial;padding:3px;}
.info h2 { color:gray;}
.info p { color:white}
.clear { clear:both; margin-top:10px;}

</style>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('.galleryImage').hover(
    function(){
        $(this).find('img').animate({width:200, marginTop:10, marginLeft:10}, 500);
    },
    function(){
        $(this).find('img').animate({width:325, marginTop:0, marginLeft:0},300);
    });
});
</script>

</head>
<body>
    
<div class="galleryContainer">

<!--galleryEntry-->    
  <div class="galleryImage">
      <img src="images/image01.jpg"></img>
      <div class="info">  
          <h2>Taylor Swift</h2>
          <p>
              Taylor Alison Swift (born December 13, 1989) is an American country pop singer-songwriter and actress.
          </p>
      </div>
    </div>
<!--end galleryEntry-->  
      
  
<!--galleryEntry-->    
  <div class="galleryImage">
      <img src="images/image02.jpg"></img>
      <div class="info">  
          <h2>Rihanna</h2>
          <p>
              Rihanna (born February 20, 1988) is a Barbadian R&B recording artist and model born in Saint Michael, Barbados.
          </p>
      </div>
      </div>
<!--end galleryEntry-->


<!--galleryEntry-->    
  <div class="galleryImage">
      <img src="images/image03.jpg"></img>
      <div class="info">  
          <h2>Black Eyed Peas</h2>
          <p>
              The Black Eyed Peas is a Grammy Award winning hip hop group that formed in Los Angeles, California in 1995.
          </p>
      </div>
      </div>
<!--end galleryEntry-->

<!--galleryEntry-->    
  <div class="galleryImage">
      <img src="images/image04.jpg"></img>
      <div class="info">  
          <h2>Lady Antebellum</h2>
          <p>
              Lady Antebellum is an American country music group formed in Nashville, Tennessee in 2006. 
          </p>
      </div>
      </div>
<!--end galleryEntry-->

<!--galleryEntry-->    
  <div class="galleryImage">
      <img src="images/image05.jpg"></img>
      <div class="info">  
          <h2>Lady Gaga</h2>
          <p>
              Lady Gaga is an American recording artist who rose to fame with her first two singles "Just Dance" and "Poker Face".
          </p>
      </div>
      </div>
<!--end galleryEntry-->
      
    
<!--galleryEntry-->    
  <div class="galleryImage">
      <img src="images/image06.jpg"></img>
      <div class="info">  
          <h2>The Killers</h2>
          <p>
              The Killers is an American rock band from Las Vegas, Nevada, formed in 2002 who have sold over 16 million records worldwide.
          </p>
      </div>
      </div>
<!--end galleryEntry-->
          
      
  </div>
  
 
 
 </div>
 
  <p class="clear">
 <a href="http://www.addyosmani.com">
  Back to AddyOsmani.com
 </a>
 </p>
 
  </body>
</html>

 

posted @ 2013-07-02 17:29  Care健康  阅读(210)  评论(0)  编辑  收藏  举报
版权
作者：Bober Song

出处：http://bober.cnblogs.com

Care健康：http://www.aicareyou.com

推荐空间：华夏名网

本文首发博客园，版权归作者跟博客园共有。

转载必须保留本段声明，并在页面显著位置给出本文链接，否则保留追究法律责任的权利。