zoukankan      html  css  js  c++  java
  • 点击事件后动画提示

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>点击事件后动画提示</title>
    <style>
    .addhot{ display:none; 100px; height:30px; line-height:30px;position:absolute; top:-80px; left:30px; padding-top:50px; text-align:center; font-size:20px; font-weight:600; color:#ff0454;}
    a.btn_like{background-position:-2px -5px;color:#ffffff;text-shadow:0 -1px 0 rgba(51,51,51,0.35);}
    a.btn_like:hover{ background-position:-2px -55px;}
    </style>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <head>
    <body>
    <div style="display:block; 180px; height:200px; position:absolute; top:200px; right:180px;">
      <div class="addhot"></div>
      <a href="javascript:void(0)" class="btn_like">还不错</a>
    </div>
    <script type="text/javascript">
    $(document).ready(function(e) {
        $(".btn_like").click(function(){
    	$(".addhot").slideDown(500).text("积分+10").hide(500);
        });
    });
    </script>
    </body>
    </html>
    

      



  • 相关阅读:
    angularjs+ionic的app端分页和条件
    js中对象的自定义排序
    angularJS入门笔记
    SpringBoot学习历程
    页面渲染流程
    跨域问题
    jquery知识点结合使用
    对bootstrap模态框的小尝试
    登录页面两端对齐的样式问题
    输入两个数字,将比较结果输出到页面
  • 原文地址:https://www.cnblogs.com/bober/p/3243001.html
Copyright © 2011-2022 走看看