zoukankan      html  css  js  c++  java
  • 鼠标移动时缩小图片显示说明

    <!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({200, marginTop:10, marginLeft:10}, 500);
        },
        function(){
            $(this).find('img').animate({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>
  • 相关阅读:
    [vp]ARC068
    [vp]ARC067
    Vision transformer
    rosetta使用silent格式储存PDB结构,节省本地存储
    CentOS7下安装JDK详细过程
    jdk下载Oracle共享账号
    虚拟机地址发生变化
    字节跳动面试题,给你一个每一项都是数值混乱顺序的数组,只要里面正确顺序的值输出。如[5,1,3,6,2,7],只要[1,2,7]
    spring boot web 第一个项目新建
    xmind-excel
  • 原文地址:https://www.cnblogs.com/bober/p/3167462.html
Copyright © 2011-2022 走看看