Question

我试图找到一种方法来改变每个会话中站点的悬停链接颜色。

我有一些javascript可以改变每个悬停的悬停颜色...

<script>
    var colors = Array("#A3F8EF", "#FF7275", "#CBB6E7", "#FF9D74", "#FDF874"),
        idx;
    $("div a").hover(function() {
        idx = Math.floor(Math.random() * colors.length); // Pick random index
        $(this).css("background-color", colors[idx]);
    }, function() {
        $(this).css("background-color", "transparent");
    });
</script>

但我不确定如何只在每个会话中执行此操作？想可能使用这个javascript https://github.com/js-cookie/js-cookie

类似

 if($.cookie("visited")){ //hover color set } else { //set hover color
 }

但是任何其他建议都会很棒

---更多信息---

刚刚发现这个网站几乎可以满足我的需求，但每天都会更改，而不是刷新。 http://www.intworks.com/不太确定它是如何完成的？

Answer 1

if(localStorage.getItem('popState') != 'shown'){
    //enter your code here to work on the initial session
        localStorage.setItem('popState','shown')
    });
}

您是否了解过HTML5本地存储？我发现它非常有用，看起来好像可以在这里应用。只是需要考虑的事情。（我在jQuery中使用的片段之上）

Answer 2

一种解决方案是再制作2个Cookie whatsession和color并将当前会话存储在whatsession。
在你的JS代码中，只检查当前会话是否等于cookie whatsession 如果两者相等，则只需使用color cookie中的颜色如果没有，请更改颜色cookie并将whatsession cookie更新为新会话。

Answer 3

我一直在试验马特的答案，并认为我已经找到了一个有效的解决方案：

<script>
    if (localStorage.getItem("visited") != "true") {
        var colors = Array("#A3F8EF", "#FF7275", "#CBB6E7", "#FF9D74", "#FDF874"),
            idx;
        idx = Math.floor(Math.random() * colors.length); // Pick random index
        sessionStorage.setItem("colour", colors[idx]);
        newColour = sessionStorage.getItem("colour");
    }
    document.getElementById("creditsTitle").style.color = newColour;
    $("div a").hover(function() {
        $(this).css("background-color", newColour);
    }, function() {
        $(this).css("background-color", "transparent");
    });
    sessionStorage.setItem("visited", "true");
</script>

这似乎工作正常但我确信可以进一步改进。

如何更改每个会话的链接颜色

3 个答案: