ホームページ作成・基礎講座・HTML・CSS・javascript・SEO対策

超初心者でも簡単にできるホームページ作成,HTML基礎講座 EasyStudyHTML

ホームページ作成 HTML基礎講座 javascriptサンプル集

ホームページ作成・HTML基礎・スタイルシート(CSS)・javascript・SEO対策



javascriptサンプル集 clear.gif  
javascriptでページを表示する度に画像をランダム表示
画像をランダムに表示させる使用例はECサイトなどの商品の画像を表示したり他のサイトでも広告に使用したりするのに適しています。
ランダムに画像が表示されるので占いやおみくじなど使用しても面白いかもしれません。
※画像の差し替えではなく、ランダム表示ですので偶然同じ画像になる可能性はあります。
サンプルソース
<html>
<head>
<title>ページを表示する度に画像をランダム表示</title>
<!--画像のランダム表示開始-->
<script language="javascript">
 function random_img1(num1,num2) {
  if((num1 - num2) > 0) {
   var big = num1
   var small = num2
  } else {
   var big = num2
   var small = num1
  }
  var range = big - small + 1
  var number = Math.floor(Math.random()*range) + small return(number)
  }

 function random_img2() {
  var img_src = "sample" + random_img1(1,3) + ".jpg"
  document.write("<img src='" + img_src + "'>")
 }
</script>

<!--画像のランダム表示終了-->
</head>
<body>
画像ランダム表示<br>
<br>
<script language="JavaScript">random_img2()</script>
</body>
</html>

※var img_src = "sample" + random_img1(1,3) + ".jpg" の行ですが、この行の「(1,3)」の部分が実際に使用する画像の数を指し、「".jpg"」は画像の種類を指します。
pcリストマークサンプル表示

ページトップへ
TOP | 利用規約(免責) | お問合せ

Agora