zoukankan      html  css  js  c++  java
  • 自定义tips

    <!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=utf-8" />
     <title>鼠标移到文字上弹出提示层</title>
     <style type="text/css">
     #esarti_ptss{ 400px; font-size: 15px; margin-bottom: 0px;height: 105px;line-height: 29px;position: relative;}
    .esarti_ptss_ab{
        opacity: 0;
        filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
        width: 315px;
        height: auto;
        position: absolute;
        top:62px;
        left: 220px;
        border: 1px solid #333;
        padding: 12px;
        text-align: left;
        line-height: 175%;
        text-indent: 2em;
        background-color:beige;
        border-radius: 25px;
        border-top-left-radius: 0px;
        transition:1s 0.5s;
        -webkit-transition:1s 0.5s; 
        -moz-transition:1s 0.5s; 
       -o-transition:1s 0.5s;
    }
    #esarti_ptss:hover .esarti_ptss_ab{
        opacity: 1;
        filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    }
     </style>
     </head>
    <body>
    <!--{$post_keywords[18]}-->
    <div id="esarti_ptss">配套设施:带我去的权威期待前往地球问滴轻微的轻微的轻微的权威的权威的轻微的前往地球问滴权威的围棋段轻微的去带我去的权威期待前往地球问滴轻微的asdasdqwdqwdqwdqwdwqdwqdqwdqw配套设施
        <div class="esarti_ptss_ab">配套设施:带我去的权威期待前往地球问滴轻微的轻微的轻微的权威的权威的轻微的前往地球问滴权威的围棋段轻微的去带我去的权威期待前往地球问滴轻微的asdasdqwdqwdqwdqwdwqdwqdqwdqw配套设施</div>
    </div>
    </body>
    </html>
    View Code

     锚点平滑滚动(转)

    <!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=utf-8" />
    <title>js平滑滚动到顶部、底部、指定地方</title>
    <script type="text/javascript" src="http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.min.js"></script>
    <style>
     .box{ height:200px; 100%; background:#ccc; margin:10px 0;}
     .location{ position:fixed; right:0; bottom:10px; 20px; background:#FFC; padding:5px; cursor:pointer;color:#003};
    </style>
    </head>
    
    <body>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box a">产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍产品介绍</div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box bottom"></div>
    
    <div class="location">
      <p class="scroll_top">返回顶部</p>
      <p class="scroll_a">产品介绍</p>
      <p class="scroll_bottom">滑到底部</p>
    </div>
    <script type="text/javascript">
     jQuery(document).ready(function($){
      $('.scroll_top').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);});
      $('.scroll_a').click(function(){$('html,body').animate({scrollTop:$('.a').offset().top}, 800);});
      $('.scroll_bottom').click(function(){$('html,body').animate({scrollTop:$('.bottom').offset().top}, 800);});
     });
    </script>
    </body>
    </html>
    View Code

    ————————

  • 相关阅读:
    请求转发和重定向
    jvm调优(新生代、老年代调优)
    servlet(对servlet的理解、生命周期)
    http的get和post请求方式
    jvm垃圾回收器(串行、吞吐量优先、响应时间优先、G1)
    java后端学习路线总结
    jvm:java中的引用(强引用、软引用、虚引用、弱引用)
    jvm直接内存(分配与回收)
    ssm(增删改查、拦截器、过滤器)
    springmvc:文件的上传与下载
  • 原文地址:https://www.cnblogs.com/cuizhenyu/p/7283797.html
Copyright © 2011-2022 走看看