02.02.2013, 18:12
|
Новичок на форуме
|
|
Регистрация: 02.02.2013
Сообщений: 4
|
|
Появление и исчезновение картинки(объекта) через определенное время.
Здравствуйте, понадобился такой скрипт для сайта, чтобы через определенное время появлялась картинка, повисела немного, и исчезла, а затем чтобы через определенное время все повторилось. В языке javascript совершенно не разбираюсь. Помогите пожалуйста.
|
|
02.02.2013, 19:18
|
|
Профессор
|
|
Регистрация: 22.02.2012
Сообщений: 212
|
|
|
|
02.02.2013, 19:59
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
Сообщение от Tek
|
решение твоей проблемы
|
немного бы его доработать
|
|
02.02.2013, 20:05
|
Новичок на форуме
|
|
Регистрация: 02.02.2013
Сообщений: 4
|
|
огромное спс даже не знаю как выразить свою радость, просто ради одного скрипта не хочется учить целый язык, хотя если честно даже интересно стало как свой проект закончу (с сайтом) возьмусь за самоучитель))) еще раз спс
|
|
02.02.2013, 20:13
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
_D1m0n_,
не губите свой сайт
|
|
02.02.2013, 20:30
|
Новичок на форуме
|
|
Регистрация: 02.02.2013
Сообщений: 4
|
|
а куда деваться просто у меня на сайте есть кнопки так сказать скрытые и вот хотел сделать как бы появляющиеся подсказки, я конечно знаю и понимаю что это можно было бы сделать и другими способами просто у меня там даже определенный сюжет назревает, который можно только таким образом решить. Да если честно я сам себя не понял))) Поэтому прикрепляю ИЗО
с картинками-ссылками я разобрался, а вот подсказки. Сайт делаю не для себя поэтому хотелось бы чтобы все было понятно)))
Последний раз редактировалось _D1m0n_, 02.02.2013 в 20:32.
|
|
02.02.2013, 20:38
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
_D1m0n_, боле мене нормальная мигалка
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<style type='text/css'>
#test{
display:none;
}
</style>
<script type='text/javascript'>
window.onload=function(){
var image = document.getElementById("test");
var i = 0, s = ["block","none"],t = [2000,5000]; //2 сек есть картинка, 5 сек нет
function show()
{ i ^= 1
image.style.display = s[i];
setTimeout(show,t[i]);
}
show()
}
</script>
</head>
<body>
<img id="test" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
</body>
</html>
Последний раз редактировалось рони, 02.02.2013 в 20:45.
|
|
02.02.2013, 20:41
|
Новичок на форуме
|
|
Регистрация: 02.02.2013
Сообщений: 4
|
|
спс огромное
|
|
03.04.2014, 18:42
|
Новичок на форуме
|
|
Регистрация: 03.04.2014
Сообщений: 2
|
|
Сообщение от рони
|
_D1m0n_, боле мене нормальная мигалка
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<style type='text/css'>
#test{
display:none;
}
</style>
<script type='text/javascript'>
window.onload=function(){
var image = document.getElementById("test");
var i = 0, s = ["block","none"],t = [2000,5000]; //2 сек есть картинка, 5 сек нет
function show()
{ i ^= 1
image.style.display = s[i];
setTimeout(show,t[i]);
}
show()
}
</script>
</head>
<body>
<img id="test" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
</body>
</html>
|
а как сделать для нескольких изображений?чтоб с различными интервалами появлялись?
|
|
03.04.2014, 21:17
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,123
|
|
Сообщение от Jakuzi
|
а как сделать для нескольких изображений?чтоб с различными интервалами появлялись?
|
учить js!!!
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<style type='text/css'>
.hide {
opacity: 0;
}
</style>
<script type='text/javascript'>
window.onload=function(){
function toggle(id, range)
{
range = range||[2,5];//2 сек картинка появляется, 5 сек исчезает
var image = document.getElementById(id),
i = 0, s = ["block","none"];
function show()
{
//image.style.display = s[i];
image.style.transition = 'all '+range[i]+'s';
image.style.webkitTransition = 'all '+range[i]+'s';
image.style.mozTransition = 'all '+range[i]+'s';
image.style.oTransition = 'all '+range[i]+'s';
image.className = i ? 'hide' : ''
setTimeout(show,range[i]*1000);
i ^= 1
}
show()
}
toggle('test')
toggle('ddd',[1,1])
toggle('bbb',[5,2])
}
</script>
</head>
<body>
<img id="ddd" src="http://javascript.ru/img/ws_1.png">
<img id="test" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
<img id="bbb" src="http://im31.gulfup.com/jus2H.jpg">
</body>
</html>
|
|
|
|