ランダムにページの異なる場所にテキストをランダムに表示させる方法

Question

ページ内の異なる場所にテキストをランダムに表示させる方法

たとえば、

ランダムに疑問符を点滅させます。 jqueryによって可能ですか？

Answer 1

はい、これが可能です。 Math.randomを使用することをおすすめします。ここでそれを行う方法の例です：

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); 
 
}

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

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

 
<div class="container"></div>

Answer 2

はい、私はあなたのコードを持ってないが：

JavascriptをMath.random（）：100から1から

Math.random(); 

その後、uは幅と高さの％のために使用することができます。

//今、あなたはいくつかのを宣言欠場100

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

に1から数学ランダム返します（絶対配置）は、HTMLの100％-100％サイズのコンポーネントに含まれ、JQueryで管理します。一つの方法（複数ある）：

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

何かのように：

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

Answer 3

はいそれが可能です。ここでは、コードは次のとおりです。の

var randomY = Math.random()*10000 % $('header').height(), 
 
\t randomX = Math.random()*10000 % $('header').width(); 
 

 
$(document).ready(function(){ 
 
    $('#question').css({ 
 
    'top' : randomY, 
 
    'left': randomX 
 
    }); 
 
});

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

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