Home > Web Front-end > HTML Tutorial > 求教一个问题,当把鼠标放到某个div上改变样式。_html/css_WEB-ITnose

求教一个问题,当把鼠标放到某个div上改变样式。_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 08:58:16
Original
1267 people have browsed it

为了减少代码量,我想把多个div统一一个ID并且只用一个js方法怎么实现
像下面这种情况附上代码

<script>$(document).ready(function(){  $("#demo").hover(function(){    $("h1").css("background-color","yellow");    },function(){    $("h1").css("background-color","pink");  });});</script></head><body><div id="demo"><h1>酷炫模板 全新体验电商轻松走入微信</h1></div>	<div id="demo"><h1>二维码轻松一扫有效统计粉丝来源.</h1></div><div id="demo">----------------------</div>
Copy after login


回复讨论(解决方案)

不要用ID 用类
$(document).ready(function(){
  $(".demo").hover(function(){
    $("h1",this).css("background-color","yellow");
    },function(){
    $("h1",this).css("background-color","pink");
  });
});

一个页面中元素的ID要保持唯一,你可以用class,name等其他属性表示
比如用class=“demo”
$(document).ready(function(){
  $(".demo").hover(function(){
    $("h1").css("background-color","yellow");
    },function(){
    $("h1").css("background-color","pink");
  });
});

不要用ID 用类
$(document).ready(function(){
  $(".demo").hover(function(){
    $("h1",this).css("background-color","yellow");
    },function(){
    $("h1",this).css("background-color","pink");
  });
});

O(∩_∩)O谢谢

一个页面中元素的ID要保持唯一,你可以用class,name等其他属性表示
比如用class=“demo”
$(document).ready(function(){
  $(".demo").hover(function(){
    $("h1").css("background-color","yellow");
    },function(){
    $("h1").css("background-color","pink");
  });
});

O(∩_∩)O谢谢
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template