[英]How can i change background image of the page when i click on navigation menu link using Javascript?
How can i change Background-image of the page when i click on navigation link using JavaScript ? 当我使用JavaScript单击导航链接时,如何更改页面的背景图像?
<li><a href="#"id="bd"onclick ="one()">facial</a></li>
<script>
function one(){
document.getElementById('bd').style.background-image=url(eye.jpg);
}
</script>
Background image can be update with backgroundImage
and the value should be string so wrap it with quotes. 可以使用
backgroundImage
更新背景图像,并且该值应为字符串,因此请用引号将其包裹起来。
<li><a href="#" id="bd" onclick="one()">facial</a> </li> <script> function one() { document.getElementById('bd').style.backgroundImage = 'url(eye.jpg)'; } </script>
Also you can simplify the code by passing the element reference. 您也可以通过传递元素引用来简化代码。
<li><a href="#" id="bd" onclick="one(this)">facial</a> </li> <script> function one(ele) { ele.style.backgroundImage = 'url(eye.jpg)'; } </script>
You could set up a class with the background image and then just add that class with JavaScript: 您可以使用背景图片设置一个类,然后使用JavaScript添加该类:
.eye {
background-image: url(eye.jpg);
}
function one() {
document.getElementById('bd').classList.add('eye');
}
That way you can also do any styling you need to do with the image. 这样,您还可以对图像进行任何样式设置。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.