html无法拒绝的表白代码,不能点击不喜欢。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>爱你哦</title> </head> <body> <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script> <style type="text/css"> .head1{ </style> <script type="text/javascript"> var count=0;$(document).ready(function(){ $('.btn-danger').mouseenter(function(){ $('.btn-danger').css('animation', 'buttonMove 0.5s infinite'); count ; console.log(count); if(count>=3){ $('.btn-danger').css('animation', ''); $('.btn-danger').css('top','500px'); $('.btn-danger').css('left','-300px'); $('.btn-danger').addClass('animated tada'); } if(count>=4){ $('.btn-danger').css('animation', 'buttonMove2 0.5s infinite '); } if(count>=6){ $('.btn-danger').css('animation', ''); $('.btn-danger').addClass('animated shake'); $('#no-btn').css('top','200px'); $('#no-btn').css('left','-400px'); } if(count>=7){ $('#no-btn').removeClass('btn-danger').addClass('btn-primary'); $('#no-btn').text('是的!'); } }); // code continues here //btn-clicked $('.btn-primary').click(function(){ $('.head1').text("哈哈,我也喜欢你!!!"); $('.head1').addClass("animated wobble"); });}); </script> <h1 class="text-center head1">你喜欢我吗?</h1> <div class="container-fluid"> <!-- row of buttons --> <div class="row"> <div class="col-xs-6 text-right"> <button class="btn btn-primary">是的!</button></div> <div class="col-xs-6"> <button class="btn btn-danger" id="no-btn">喜欢个锤子!</button></div> </div> </div> </body> </html>
评论