jquery滑块来改变身体背景

我想包括一个迷你菜单20px乘20px图像的潜在背景。当用户点击其中一个人时，身体背景图像将会更改，并且选择将保存为用户选择的内容。jquery滑块来改变身体背景

我想过使用滑块，但我不知道如何能够在li中获得图像，并且能够根据选择更改主体css。

任何想法？

快乐7月4日

编辑我试图保存在cookie中的图像网址，它不工作寿，其节省的Cookie，但它不是检索cookie的内容

编辑以下作品，!!!!!!!但背景颜色始终是白色的，即使我添加一个$("html").css("background-color","red");

FIX，在URL的末尾添加颜色

$("html").css("background", "url('" + imgCookieLink + "') no-repeat fixed center top #343837"); 


$(document).ready(function() { 
$("#BGSelector a").click(function() { 
    var imgLink = $("img", this).attr("src"); 
    $.cookie("html_img", "" + imgLink + "", { expires: 7 }); 
    var imgCookieLink = $.cookie("html_img"); 
    $("html").css("background", "url('" + imgCookieLink + "')"); 
}); 
}); 

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#BGSelector a").click(function() { 
     var imgLink = $("img", this).attr("src"); 
     $.cookie("html_img", "" + imgLink + "", { path: '/vitamovie', expires: 7 }); 
     var imgCookieLink = $.cookie("html_img");  
     $("html").css("background", "url('" + imgCookieLink + "') no-repeat fixed center top"); 
    }); 
}); 

</script> 

<script type="text/javascript"> 
$(document).ready(function() { 
     var imgCookieLink = $.cookie("html_img"); 
     $("html").css("background", "url('" + imgCookieLink + "') no-repeat fixed center top"); 

}); 

</script>

来源

2009-07-05 vache

感谢tvanfosson的编辑：D – vache 2009-07-05 01:45:25

我不知道为什么背景颜色不会改变。但我强烈建议你尝试$（“body”）.css（“background-color”，“＃FF0000”），看看会发生什么。 – xandy 2009-07-05 14:51:18

$（“body”）.css（“background-color”，“＃FF0000”）; 工作正常， – vache 2009-07-05 15:06:32

不知道为什么你的“选择”一些条款使用滑块是离散。一般来说，滑块用于连续更改值，如选择RGB值（每个通道从0到255）。为了您的小菜单的事情，这是非常简单的JQ + CSS：

HTML标记的菜单

<ul id="BGSelector"> 
    <li><a href="#ChangeBG"><img src="bgImageSource1"/></a></li> 
    <li><a href="#ChangeBG"><img src="bgImageSource2"/></a></li> 
    <li><a href="#ChangeBG"><img src="bgImageSource3"/></a></li> 
</ul>

和魔术JQ报表

// Init the bg change UI (which is within document ready) 
$(function(){ 
    $("#BGSelector a").click(function() { 
     var imgLink = $("img", this).attr("src"); 

     // change the body background css 
     $("body").css("background", "url('" + imgLink + "')"); 
    }); 
});

来源

2009-07-05 01:49:28 xandy

我有同样的问题。我不知道这是否有用，但是，我做的是

var url= data.bgimg[0] ; 
$('body').css('background-image',"url(" + url + ")");

其中url（显然）是img的路径。我通过json获得了它，但是你可以改变它。

来源

2010-01-28 00:56:17 chepe263

var newBg = ['headercaption.gif', 'loading.gif', 'excelexport.gif', 'grid-layer.gif']; 
var path="themes/default/images/"; 
var i = 0; 
var rotateBg = setInterval(function(){ 
    $('body').css('backgroundImage' , "url('" +path+newBg[i]+ "')"); 
    if(i==4) 
    i=0; 
    else 
     i++; 
}, 5000);

来源

2011-04-07 06:15:32 atheeq

jquery滑块来改变身体背景

回答

相关问题