下载提示效果

 

下载提示效果,点击可以查看大图
需      要: 0.0 金币
折      扣: 100 (% 折)
 
相关搜索: 下载 提示效果 
下载次数: 8
支持一下(1)
100.00%
踩一下(0)
0.00%
  • 下载等级:
  • 编  号: 20120601174455
  • 浏览器兼容IE7.0,IE8.0,IE9.0,Firefox9.0及以前,Firefox10.0,Chrome17.0及以前,Chrome18.0
  • 更新日期: 2012-06-01
  • 大  小: 59.16K
  • 浏览次量: 3426
  • 开发者链接: 官网  演示
  • 相  关: 违规举报
  • 收  藏:( 0 人收藏) 加入收藏
  • 此内容校验人员: sinacomcn
分享到:   
pengbin  
 中尉 上传于/2012-06-01 17:46:26
VIP会员   
   

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>下载提示特效 by 25175</title>
    <style type="text/css" media="screen">
    <!--
        * {
            margin: 0;
            padding: 0;
        }
       
        body {
            padding: 10px;
        }
       
        h1 {
            margin: 14px 0;
            font-family: 'Trebuchet MS', Helvetica;
        }
       
        p {
            margin: 14px 0;
            font-family: 'Trebuchet MS', Helvetica;
        }
       
        .bubbleInfo {
            position: relative;
            top: 150px;
            left: 100px;
            width: 500px;
        }
        .trigger {
            position: absolute;
        }
    
        /* Bubble pop-up */

        .popup {
         position: absolute;
         display: none;
         z-index: 50;
         border-collapse: collapse;
        }

        .popup td.corner {
         height: 15px;
         width: 19px;
        }

        .popup td#topleft { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-1.png); }
        .popup td.top { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-2.png); }
        .popup td#topright { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-3.png); }
        .popup td.left { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-4.png); }
        .popup td.right { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-5.png); }
        .popup td#bottomleft { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-6.png); }
        .popup td.bottom { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-7.png); text-align: center;}
        .popup td.bottom img { display: block; margin: 0 auto; }
        .popup td#bottomright { background-image: url(http://static.jqueryfordesigners.com/demo/images/coda/bubble-8.png); }

        .popup table.popup-contents {
         font-size: 12px;
         line-height: 1.2em;
         background-color: #fff;
         color: #666;
         font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
         }

        table.popup-contents th {
         text-align: right;
         text-transform: lowercase;
         }

        table.popup-contents td {
         text-align: left;
         }

        tr#release-notes th {
         text-align: left;
         text-indent: -9999px;
         background: url(http://jqueryfordesigners.com/demo/images/coda/starburst.gif) no-repeat top right;
         height: 17px;
         }

        tr#release-notes td a {
         color: #333;
        }
       
    -->
    </style>

    <script src="coda-bubble_files/jquery.js" type="text/javascript"></script>

    <script type="text/javascript">
    <!--

    $(function () {
        $('.bubbleInfo').each(function () {
            var distance = 10;
            var time = 250;
            var hideDelay = 500;

            var hideDelayTimer = null;

            var beingShown = false;
            var shown = false;
            var trigger = $('.trigger', this);
            var info = $('.popup', this).css('opacity', 0);


            $([trigger.get(0), info.get(0)]).mouseover(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                if (beingShown || shown) {
                    // don't trigger the animation again
                    return;
                } else {
                    // reset position of info box
                    beingShown = true;

                    info.css({
                        top: -90,
                        left: -33,
                        display: 'block'
                    }).animate({
                        top: '-=' + distance + 'px',
                        opacity: 1
                    }, time, 'swing', function() {
                        beingShown = false;
                        shown = true;
                    });
                }

                return false;
            }).mouseout(function () {
                if (hideDelayTimer) clearTimeout(hideDelayTimer);
                hideDelayTimer = setTimeout(function () {
                    hideDelayTimer = null;
                    info.animate({
                        top: '-=' + distance + 'px',
                        opacity: 0
                    }, time, 'swing', function () {
                        shown = false;
                        info.css('display', 'none');
                    });

                }, hideDelay);

                return false;
            });
        });
    });
   
    //-->
    </script>
</head>
<body id="page">
  
    <div class="bubbleInfo">
        <div>
            <img class="trigger" src="coda-bubble_files/nav-download.png" id="download">
        </div>
        <table style="opacity: 0; top: -110px; left: -33px; display: none;" id="dpop" class="popup">
         <tbody><tr>
          <td id="topleft" class="corner"></td>
          <td class="top"></td>
          <td id="topright" class="corner"></td>
         </tr>

         <tr>
          <td class="left"></td>
          <td><table class="popup-contents">
           <tbody><tr>
            <th>File:</th>
            <td>coda 1.1.zip</td>
           </tr>
           <tr>
            <th>Date:</th>
            <td>11/30/07</td>
           </tr>
           <tr>
            <th>Size:</th>
            <td>17 MB</td>
           </tr>
           <tr>
            <th>Req:</th>
            <td>Mac OS X 10.4+</td>
           </tr>      
           <tr id="release-notes">
            <th>Read the release notes:</th>
            <td><a title="Read the release notes" href="http://jqueryfordesigners.com/demo/releasenotes.html">release notes</a></td>
           </tr>
          </tbody></table>

          </td>
          <td class="right"></td>   
         </tr>

         <tr>
          <td class="corner" id="bottomleft"></td>
          <td class="bottom"><img alt="popup tail" src="coda-bubble_files/bubble-tail2.png" height="29" width="30"></td>
          <td id="bottomright" class="corner"></td>
         </tr>
        </tbody></table>
    </div>
 <a href="http://www.25175.com">25175</a>
</body></html>

 购买记录
cping1210
新兵
rg0606
新兵
刘涛_90
新兵
sun9121
新兵
jboy338
新兵
samjh
新兵
plutothe
新兵
whotext
新兵
会员评论:  

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。

  验证码:
 
反馈请帮助我们提高!意见反馈