同じフォルダに5つの画像があります。 1.jpg、2.jpg、3.jpg、4.jpg、5.jpg 私は自分のウェブページに1つの画像しか表示しません。 例えばマウスオーバーイメージスライドがgif画像として開始されるとき
<body>
<img src="1.jpg">
</body>
訪問者が画像上にマウスである場合、画像は2.JPGの変更と、3.JPGなり、.... 5.jpg.Slideshowで停止するには、GIF画像と同様です。
どうか、javascriptまたはjqueryを記述してください。
最も簡単な方法を教えてください。
親愛なる友人に感謝します。
私はこのウェブサイトでsimalorの質問を見つけました。しかし私は完全な答えを見つけることができません。
この質問が重複している場合は、ごめんなさい
英語の貧弱な使い方を教えてください。
jQueryのホバーイベントを使用して、onenterとonoutのメソッドを渡すことができます。入力すると、画像の番号を増やすためにインターバルを呼び出して設定することができます。また、インターバルをクリアすることで画像の数を増やすことができます。
<!DOCTYPE html>
<html>
<head>
<title>image</title>
</head>
<body>
<img id="img" src="1.jpg" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
var interval = null;
function changeImage(){
var nextNum = parseInt($('#img').attr('src').replace('.jpg',''), 10) + 1;
// If you want it to repeat back to 1 after 5
nextNum = nextNum > 5 ? 1 : nextNum;
$('#img').attr('src', nextNum+'.jpg');
}
$('#img').hover(
function(){
// Call change Image every 50ms
interval = setInterval(changeImage, 50);
changeImage();
},
function(){
// Stop the call
interval && clearInterval(interval);
}
);
</script>
</body>
</html>
こんにちは私の親愛なる友人、私は画像の上にあなたsay.Whenマウスとして試みは、完全なコードをchange.Myされていない 'コード'
'コード' –
こんにちは、右の ''
前に、あなたのページの下部にある2つの ''
本文を改善してください。私はあなたが何を望んでいるのか理解できません。 – gdoron
また、あなたが試したことを示してください。 – simchona
あなたのコメントの私の友人よりも。私は例link.http：//www.clipsharedemo.com/を表示します。このウェブサイトに行く。トルコのニースの歌の写真を参照してください。マウスを重ねると、画像が変更されます。私は真剣です。 –