zoukankan      html  css  js  c++  java
  • 一款手动幻灯图片效果

    <html>

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>网页特效| www.qpsh.com</title>
    <style>
    .spic a img{-moz-opacity:0.5; filter:alpha(opacity=50);border:0px;}
    .spic a:hover{font-size:9px;}
    .spic a:hover img{-moz-opacity:0.5; filter:alpha(opacity=100);cursor:hand;}
    </style>
    <script>
    function seeBig(thispic) {
      if(thispic==1){
        document.all.viewPic.innerHTML='<a target=_blank href=http://www.qpsh.com><img border=0 src=http://news.xinhuanet.com/photo/2007-12/18/xinsrc_32212041808203903041948.jpg width=300 height=250 style="border: 1px solid #C0C0C0"></a>'
      }
      if(thispic==2){
        document.all.viewPic.innerHTML='<a target=_blank href=http://www.qpsh.com><img border=0 src=http://news.xinhuanet.com/photo/2007-10/11/xinsrc_242100411072412537118.jpg width=300 height=250 style="border: 1px solid #C0C0C0"></a>'
      }
      if(thispic==3){
        document.all.viewPic.innerHTML='<a target=_blank href=http://www.qpsh.com><img border=0 src=http://news3.xinhuanet.com/world/2007-01/15/xin_0220104150902234148817.jpg width=300 height=250 style="border: 1px solid #C0C0C0"></a>'
      }
      if(thispic==4){
        document.all.viewPic.innerHTML='<a target=_blank href=http://www.qpsh.com><img border=0 src=http://news.xinhuanet.com/photo/2007-12/19/xinsrc_29212041908371712536913.jpg width=300 height=250 style="border: 1px solid #C0C0C0"></a>'
      }
    }
    </script>
    </head>

    <body>

    <table border="0" width="300" cellpadding="0" style="border-collapse: collapse">
     <tr>
      <td colspan="7" align="center" id="viewPic"><a target=_blank href=http://www.qpsh.com>
      <img  src="http://news.xinhuanet.com/photo/2007-12/18/xinsrc_32212041808203903041948.jpg" width=300 height=250 style="border: 1px solid #C0C0C0"></a></td>
     </tr>
     <tr>
      <td colspan="7" align="center"  height="15"></td>
     </tr>
     <tr>
      <td align="center" width="70"><span class="spic">
      <a href=# onmouseover="javascript:seeBig(1)" style="cursor:pointer">
      <img border="0" src="http://news.xinhuanet.com/photo/2007-12/18/xinsrc_32212041808203903041948.jpg" width="65" height="50" style="border: 1px solid #C0C0C0"></a></span></td>
      <td align="center" width="7"></td>
      <td align="center" width="70"><span class="spic">
      <a href=# onmouseover="javascript:seeBig(2)" style="cursor:pointer">
      <img border="0" src="http://news.xinhuanet.com/photo/2007-10/11/xinsrc_242100411072412537118.jpg" width="65" height="50" style="border: 1px solid #C0C0C0"></a></span></td>
      <td align="center" width="7"></td>
      <td align="center" width="70"><span class="spic">
      <a href=# onmouseover="javascript:seeBig(3)" style="cursor:pointer">
      <img border="0" src="http://news3.xinhuanet.com/world/2007-01/15/xin_0220104150902234148817.jpg" width="65" height="50" style="border: 1px solid #C0C0C0"></a></span></td>
      <td align="center" width="6"></td>
      <td align="center" width="70"><span class="spic">
      <a href=# onmouseover="javascript:seeBig(4)" style="cursor:pointer">
      <img border="0" src="http://news.xinhuanet.com/photo/2007-12/19/xinsrc_29212041908371712536913.jpg" width="65" height="50" style="border: 1px solid #C0C0C0" align="right"></a></span></td>
     </tr>
    </table>

    </body>

    </html>
    本代码由<a href=http://www.qpsh.com>网页特效网</a>提供

  • 相关阅读:
    怎样才能算是在技术上活跃的小公司
    jquery幻灯片--渐变
    cpm效果介绍
    我依然热爱编程
    项目开发经验终结2015/4/7
    windows上putty访问ubuntu
    ubuntu安装openssh-server
    今天犯了一个低级错误
    linux 搭建lamp环境
    能用存储过程的DBHelper类
  • 原文地址:https://www.cnblogs.com/fanjiming/p/2247270.html
Copyright © 2011-2022 走看看