Javascript JQuery-更改多个背景图像
我有一个CSS代码,它使用8个图像创建一个框架:Javascript JQuery-更改多个背景图像,javascript,jquery,html,css,background,Javascript,Jquery,Html,Css,Background,我有一个CSS代码,它使用8个图像创建一个框架: background-image: url(images/blue/tl.png), url(images/blue/tr.png), url(images/blue/bl.png), url(images/blue/br.png), url(images/blue/t.png),url(images/blue/b.png),url(images/blue/l.png),url(images/blue/r.png); background-pos
background-image: url(images/blue/tl.png), url(images/blue/tr.png), url(images/blue/bl.png), url(images/blue/br.png), url(images/blue/t.png),url(images/blue/b.png),url(images/blue/l.png),url(images/blue/r.png);
background-position: top left, right top, bottom left, bottom right, top, bottom, left,right;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat,repeat-x,repeat-x,repeat-y,repeat-y;
我的目标是制作一个JQuery程序,可以将源代码更改为不同的图像。我在为多个背景图像定义JQuery中的更改时遇到问题。我总是只改变一个图像
JQuery代码:
$(document).ready(function() {
$("#red").on("click", function(){
$("#outer-frame").css({'background-image': "url(images/red/tl.png)", 'background-image': "url(images/red/tr.png)"});
$("#outer-frame").css({'background-position': "top left", 'background-image': "top right"});
});
如果有人知道怎么做,我会非常感激的。
谢谢您的建议。要使用javascript设置多个背景图像,只需设置一次样式,但要使用多个背景字符串作为值,否则每次重置样式都会覆盖以前的样式等
$("#outer-frame").css({
'background-position' : 'top left',
'background-image' : 'url(images/red/tl.png), url(images/red/tr.png)'
});
不要在标题中写“已解决”,而是通过单击灰色复选标记接受有效的答案