-2

htmlとjavascriptを使用して、自分のサイトに回転するロゴを作成しようとしています。

ページの読み込み時に回転させて、ランダムに読み込みたい。

私はたくさんのことを試しました！私はグーグルで見つけました、そして私はそれを動かすことができないようです。私はそれを行うためにphpを使用することを避けようとしています。

以下のようなタグにランダムな画像を入れたい（可能であれば）

<img src="" />

だから、それを要約するだけです。

「html」と「javascript」を使用して、ページが更新されるたびにサーバー上のディレクトリから新しいロゴをロードするスクリプトを作成したいと思います。

編集：私が試したこと

<script type="javascript>
    Array.prototype.random = function () { 
        return this[ parseInt( Math.random() * this.length )  ];
    }

    var myImage=[ 
        "logo1.png",
        "logo1.png",
        "logo1.png",
        "logo1.png"
    ].random()

    document.wite(myImage)
</script>
4

5 に答える 5

4

document.writeの使用は避けてください。代わりに、タグにid属性を設定し、document.getElementByIdを使用してそれを取得します。imgsetIntervalメソッドを使用して、間隔を置いて更新することができます。

<img id="logo" />
<script type="text/javascript">
var logos = ["logo1.png", "logo2.png", "logo3.png"];
var currentLogoIndex = 0;
function updateLogo() {
    document.getElementById('logo').src = logos[currentLogoIndex];
    currentLogoIndex++;
    currentLogoIndex %= logos.length;
}
window.setInterval(updateLogo, 1000);
updateLogo();
</script>
于 2012-06-29T01:24:09.883 に答える
2

を配列に格納し、pathesrandomを使用してそれらを選択できますindex。

$(document).ready(function() {

var src = ['path1.jpg', 'path2.jpg', 'path3.jpg', 'path4.jpg', 'path5.jpg', 'path6.jpg', 'path7.jpg', 'path8.jpg', 'path9.jpg'];

$('img').attr('src', src[Math.floor(Math.random()*10)]) // it returns a number between 0 and 10

});
于 2012-06-29T01:26:01.853 に答える
1

ご存知のとおり、CSS変換を利用するjQueryプラグインがあります。

http://www.zachstronaut.com/posts/2009/08/07/jquery-animate-css-rotate-scale.html

于 2012-06-29T01:41:52.690 に答える
0

私はphpの人に頼っています。

<img src="/images/logo/<?php $random = rand(1,3); echo $random; ?>.png" alt="LOGO!!!!" />

完璧に動作します:)

于 2012-06-29T01:53:55.210 に答える
0 
<html>
<body>
<h1>Random logo From List</h1>
<script type="javascript>
    Array.prototype.random = function () { 
        return this[ parseInt( Math.random() * this.length )  ];
    }

    var myImage=[ 
        "logo1.png",
        "logo1.png",
        "logo1.png",
        "logo1.png"
    ].random()

    document.wite("<img src='" + myImage + "' />)
</script>

<h2>Hoo just got a random logo</h2>
</body>
</html>

これはあなたが試したもののように見えます：

document.writeとdocument.getElementを使用した少しの説明：

</h1>上記のようにインラインコードを作成すると、document.writeを使用でき、通常の「印刷」操作のように直後にテキストが追加されます。

ドキュメントの読み込み後に使用すると、すべてがクリアされ、すべてが上書きされます。

ロード後にドキュメントを変更する場合は、DOMを編集する必要があります。ドキュメントは、ロード後にDOMとして表されます。その場合、次のようなさまざまなDOM操作関数を使用する必要があります。

document.getElementById('logo-image').src = myImage;
于 2012-06-29T02:03:21.690 に答える