ニュース速報のページを作る
横に流れるような効果
yahooから適当なニュース群をこぴって配列で配置。
ランダムでとりあえずニュースを出す
>Math.random()関数
0–1（0以上、1未満）の範囲で浮動小数点の擬似乱数を返します。その範囲ではほぼ均一な分布で、ユーザーは範囲の拡大をすることができます。実装側で乱数生成アルゴリズムの初期シードを選択し、ユーザーが初期シードを選択、またはリセットすることは出来ません。
2つの値の間の乱数を得る
この例は指定した値の間の乱数を返します。戻り値は min 以上、 max 未満です。
function getRandomArbitrary(min, max) {
return Math.random() * (max - min) + min;
}
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/random
川の中に船が動くイメージで
①div frameの中にdiv slide
②各々color,width,heightなど設定
③slideはわざと margin-left:550px;としておく
④はみ出した部分をoverflow: hidden;で非表示
--->test1.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="test1.css">
<title>slide</title>
<script src="../jquery-3.4.1.min.js"></script>
</head>
<body>
<div id="frame">
<div id="slide"></div>
</div>
<script src="test1.js"></script>
</body>
</html>
--->test1.js
$(function(){
console.log('hoge');
var news=[
'70歳まで就業機会確保 政府案',
'東海第2 予算700億円オーバー',
'男女平等121位 過去最低に',
'チャイルドシート 厚着は危険',
'妻救って去った恩人 見つかる',
'筒香レイズ入り発表 背番は25',
'川越シェフ 3年ぶりTV復帰',
'マツコ 宇多田ヒカルと初共演',
'災厄はらう火の舞'
];
//console.log(news);
var ran = Math.floor(Math.random()*news.length);
console.log(ran);
$('#slide').text(news[ran]);
})
