Question

如何使文本随机显示在页面的不同位置。

例如：

我希望标题中的问号随机闪烁。是否可以通过jquery？。

Answer 1

是的，这是可能的。我建议使用Math.random。以下是如何操作的示例：

＆＃13;

maxNum = 30;
setTimeout(time,700);

function time() {
  if ($('.qusetion').length > maxNum) {
    return;
  }
  for (var i = 0; i < 30; i++) {
    $("<div class='question'>?</div>")
      .appendTo(".container")
      .css({
        "left" : $(".container").width() * Math.random(),
        "top" : $(".container").height() * Math.random()
      })
      .fadeIn(500 * Math.random(), function () {
        $(this).fadeOut(500 * Math.random(), function () {
          $(this).remove();
        });
      });
  }
  setTimeout(time,500 * Math.random() + 100);
}

＆＃13;

.question {
  position:fixed;
  display:none;
}
.container {
  width:100px;
  height:100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="container"></div>

＆＃13;

Answer 2

是的，我不会为您提供代码，但是：

Javascript Math.random（）：

Math.random();

从1到100，你可以使用％的宽度和高度：

//从1到100返回数学随机

Math.floor((Math.random() * 100) + 1);

现在你只是错过声明HTML中100％-100％大小的组件中包含的一些<span>（绝对定位）并使用JQuery管理它们。一种方式（还有更多）：

$('#elementID').css('property': 'value');

类似的东西：

random = Math.floor((Math.random() * 100) + 1)
$('#span').css('top', random + '%');
$('#span').css('left', random + '%');

Answer 3

是的，这是可能的。这是代码：

＆＃13;

var randomY = Math.random()*10000 % $('header').height(),
	randomX = Math.random()*10000 % $('header').width();

$(document).ready(function(){
  $('#question').css({
    'top' : randomY,
    'left': randomX 
  });
});

＆＃13;

header{
  height: 500px;
  width: 100%;
  position: relative;
}
#question{
  position: absolute;
}

＆＃13;

<header>
  <span id="question">?</span>
</header>

＆＃13;

如何使文本随机地随机显示在页面中的不同位置

3 个答案: