jq 放微信朋友圈显示隐藏
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } .myDiv { overflow: hidden; position: relative; margin-top: 50px; } .tip_brother { float: right; list-style: none; margin-right: 30px; } .tip { float: right; } .img { width: 50px; height: 50px; } </style> <link rel="stylesheet" type="text/css" href="animate.min.css" /> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> </head> <body> <div id="66"> <div class="myDiv"> <img src="baby.jpg" class="img tip" /> <div class="tip_brother"> <img src="baby.jpg" class="img" /> <img src="baby.jpg" class="img" /> <img src="baby.jpg" class="img" /> </div> </div> </div> <div id="66"> <div class="myDiv"> <img src="baby.jpg" class="img tip" /> <div class="tip_brother"> <img src="baby.jpg" class="img" /> <img src="baby.jpg" class="img" /> <img src="baby.jpg" class="img" /> </div> </div> </div> <div id="66"> <div class="myDiv"> <img src="baby.jpg" class="img tip" /> <div class="tip_brother"> <img src="baby.jpg" class="img" /> <img src="baby.jpg" class="img" /> <img src="baby.jpg" class="img" /> </div> </div> </div> <script type="text/javascript"> $(".myDiv .tip_brother").hide(); $(".myDiv .tip").click(function() { $(".myDiv .tip_brother").each(function() { if($(this).css("display") == "block") { $(this).css("display", "none"); } }); $(this).next().slideToggle("fast"); }); $(".myDiv .tip_brother").click(function() { $(this).slideToggle("fast"); }); </script> </body></html>
