Question

我想弄清楚每次有人登录我的网站时如何让某个div出现一次。我已经看到使用javascript和php两种方法，但没有成功。

这是我的代码，我希望（如果可能的话）#spinner div（以及其中的所有内容）在每个会话中显示一次。

<body>
****This part would only be displayed once****
<div id="spinner" style="display: none;">
<div class="sketch">
<canvas id="canvas" width="1280" height="224"></canvas>
<script>var canvas = document.getElementById('canvas')
  , context = canvas.getContext('2d')
  , img = new Image()
  , w
  , h
  , offset
  , glitchInterval;

img.src = 'http://www.bccustommade.com/images/loading.png';
img.onload = function() {
  init();
window.onresize = init;
};

var init = function() {
clearInterval(glitchInterval);
canvas.width = w = window.innerWidth;
offset = w * .1;
canvas.height = h = ~~(175 * ((w - (offset * 2)) / img.width));
glitchInterval = setInterval(function() {
    clear();
    context.drawImage(img, 0, 110, img.width, 175, offset, 0, w - (offset * 2), h);
    setTimeout(glitchImg, randInt(250, 1000));
}, 500);
};

var clear = function() {
context.rect(0, 0, w, h);
context.fill();
};

var glitchImg = function() {
for (var i = 0; i < randInt(1, 13); i++) {
    var x = Math.random() * w;
    var y = Math.random() * h;
    var spliceWidth = w - x;
    var spliceHeight = randInt(5, h / 3);
    context.drawImage(canvas, 0, y, spliceWidth, spliceHeight, x, y, spliceWidth, spliceHeight);
    context.drawImage(canvas, spliceWidth, y, x, spliceHeight, 0, y, x, spliceHeight);
}
};

var randInt = function(a, b) {
return ~~(Math.random() * (b - a) + a);
};</script>
</div>
<div class="loading">
    <div class="loading-dot"></div>
    <div class="loading-dot"></div>
    <div class="loading-dot"></div>
<div class="loading-dot"></div>
</div>
</div>
****This part would only be displayed once****

Answer 1

编写这些内容，直到某个会话的值为true。并且一旦显示就将会话值设置为true。

我不熟悉PHP语法，但页面逻辑会像这样。

if(session contains key "first_time" && session["first_time"] == false){

 print "your code here";
 // set session value to true
 session["first_time"] = true;

}

如果您希望在所有页面上显示此内容，请在每个PHP页面中包含此页面

Answer 2

您需要通过javascript调用此PHP脚本或直接在javascript中阅读PHP变量，但我建议使用某种后端调用。

<?php 
session_start();

if(!isset($_SESSION['spinner']) {
    // Render content
}

// Continue with page or other sutff
?>

需要一个div才能在每个会话中显示一次

2 个答案: