当点击一个按钮时变色,其他按钮恢复原来的 颜色

xiaoxiao2021-02-28  103

<!DOCTYPE html> <html> <head> <title>userInformation.html</title> <meta name="keywords" content="keyword1,keyword2,keyword3"> <meta name="description" content="this is my page"> <meta name="content-type" content="text/html; charset=UTF-8"> <script src="../js/jquery-1.9.1.min.js"></script> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> <style type="text/css"> .information { width: 100%; height: 800px; background-color: #e3e4e5; } .information .leftdiv { height: 800px; width: 230px; float: left; background-color: white; margin-left: 10%; } .information .leftdiv div { background-color: #f5f5f5; width: 200px; height: 50px; margin-left: auto; margin-right: auto; margin-top: 20px; color: #666666; text-align: center; line-height: 50px; } .start { cursor: pointer; background: white; } .end { cursor: pointer; color: black; background: #2eafbb; } .information .leftdiv div a { text-decoration: none; } </style> </head> <body> <!-- 这个页面主要是进行用户信息的展示 --> <div class="information"> <div class="leftdiv"> <div class="flag"> <a href="#">账户信息</a> </div> <div class="flag"> <a href="#">修改信息</a> </div> <div class="flag"> <a href="#">登录日志</a> </div> </div> </div> </body> <script> $(".leftdiv div").click( function() { $(".leftdiv div").eq($(this).index()).css('background', '#2eafbb').siblings().css('background', '#f5f5f5'); }) </script> </html>
转载请注明原文地址: https://www.6miu.com/read-1949975.html

最新回复(0)