Я пытаюсь изменить фоновое изображение моего веб-сайта (в теге body), когда пользователь нажимает кнопку меню и переходит на другую веб-страницу.
Я использую jquery в _Layout.cshtml и делаю так:
<body>
<div class="page">
<header>
<br />
<div id="menubutton">
<a href="@Url.Action("Index", "Kitchen")" id="bg1">
<img src="../../Content/Layout_images/menu_kitchen.png" alt="kitchen" /></a>
<a href="@Url.Action("Index", "Stock")" id="bg2" >
<img src="../../Content/Layout_images/menu_stock.png" alt="stock" /></a>
<a href="@Url.Action("Index", "Shop")" id="bg3" >
<img src="../../Content/Layout_images/menu_shop.png" alt="shoppinglist" /></a>
</div>
<script type="text/javascript">
$(function () {
$('#menubutton a').live('click', function () {
// Get the background class from id
var bgclass = $(this).attr('id');
var temp = "url('Content/Layout_images/bg2.jpg')";
$('body').css('background-image', temp);
alert($('body').css('background-image'));
// Set the clicked menu button color
var menuclass = bgclass + "_menu";
$(this).removeClass();
$(this).addClass(menuclass);
});
});
Однако, хотя фоновое изображение меняется, когда пользователь нажимает кнопку меню, оно сразу же возвращается к фоновому изображению по умолчанию, установленному в css (Примечание: даже если я не установил любое фоновое изображение на css, оно немедленно изменится на пустое фон после перенаправления страницы)
Есть идеи, почему это происходит? Если не ошибаюсь, предположим, что jquery .css () изменит css конкретного домена? Почему он все равно будет сброшен после перехода на другую страницу?
Надеюсь, здесь можно помочь ... спасибо ...