HTML

Question

我一直在研究如何在刷新时交换两个图像或div。我找到了一些消息来源，但没有人做我想让他们做的事情。以下是我希望我的工作方式：

我有两个带有图像的div。一个div高于另一个。顶部div将显示一个图像，底部div将显示不同的图像。我希望每次刷新或重新访问页面时，图像或div都会切换，无论哪个更有意义。

以下是我对广告的简单CSS编码（位于我的侧边栏中）：

#sidebar {float:left; width:300px; min-height:400px; }

#sidebarhomenewsad1 { width:290px; height:580px; margin-bottom:10px; }

#sidebarhomenewsad2 { width:290px; height:580px; margin-bottom:10px; }

我使两个div完全相同，只是不同的名称，因为我不知道刷新时的图像交换是否需要两个不同的div。

总结一下，在刷新/重新访问页面时，我想要两个不同的图像（一个在下面，一个在上面）相互切换/交换。

任何帮助都会非常感激！：）

Answer 1

您可以使用Cookie制作它。在第一次访问时，如果未设置cookie（例如'upper_div_num'），则应将1st div显示为upper，并将cookie值设置为1.下次，您应检查'upper_div_num'cookie，如果是，则将其设置为2如果为2或未设置，则将其设置为1。 PHP或Javascript代码应检查此cookie值并相应地定位div。

Answer 2

使用jQuery.cookie()

HTML

<img class="a" src="http://i.imgur.com/dCabSb.jpg" />
<img class="b" src="http://i.imgur.com/ZUTsGb.jpg" />

JS

if (!$.cookie('currentImage')) {
    $.cookie('currentImage', '1')
} else {
    if ($.cookie('currentImage') == '1') {

        tmp = $('.a').attr('src');
        $('.a').attr('src', $('.b').attr('src'));
        $('.b').attr('src', tmp);

        $.cookie('currentImage', '2')
    } else {
        $.cookie('currentImage', '1')
    }
}

小提琴 - http://jsfiddle.net/mrYaA/

刷新时交换两个不同的图像/分区

2 个答案:

HTML

JS