dポイントプレゼントキャンペーン実施中!

みなさんこんばんは。
いつもお世話になっております。

JavaScriptで数秒後に画像の上に画像を載せたいのですが・・・・。

まだはじめたばかりで、どうすれいいのかわかりません・・。

A 回答 (2件)

いめーじようそは、いんらいんがたなので、ぶろっくようその


なかに。
いちは、すたいるしていで。
じかんは、setTimeoutで。

かんすうaddImageに、setTimeoutでつかうかんすうを
つくらせ、さらにそれをとうろくして、じっこうするだけの
じょうたいのものをかえさせる。

したは、へんすうgにそれをだいにゅう。
それをじかんをずらして、じっこう。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title>TEST</title>
<body>
<p>
<img src="1.gif" width="600" height="600">
</p>
<script type="text/javascript">
var addImage = function ( src, alt, title, wait, x, y ) {
var p = document.createElement( 'div' );
var img = document.createElement( 'img' );
var s = img.style;

img.alt = alt;
img.title = title;

s.position = 'absolute';
s.top = (y|0) + 'px';
s.left = (x|0) + 'px';

p.appendChild( img );

var view = function( ) {
document.body.appendChild( p );
};

return function ( ) {
setTimeout( view, wait );
};
};

var imgsrc = './img/0.gif';

for(i = 0; i<36 ; i++ ) {
var px = 300 + Math.sin( i * 3.14159 / 18 ) * 250;
var py = 300 - Math.cos( i * 3.14159 / 18 ) * 250;
var g = addImage( imgsrc, '*', '', 2000 + i * 100, px, py );
g();
}

</script>
    • good
    • 0

一番簡単(?)な例を。



重なっていて非表示になっている画像を、javascriptでn秒後に表示させているだけという方法です。

<html>
<head><title>test</title>
<script type="text/javascript">
function test(n) {
setTimeout(function() {
document.getElementById('target').getElementsByTagName('IMG')[1].style.display = 'block';
}, n*1000);
}
</script>
</head>

<body>
<div style="position:relative;" id="target">
<img src="A.jpg" alt="testA">
<img src="B.jpg" alt ="testB" style="position:absolute; top:0; left:0; display:none;">
</div>
<p>
2秒後に表示<br>
<input type="button" value="test" onclick="test(2);">
</body>
</html>
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!