ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Двигающийся DIV
10 сообщений из 10, страница 1 из 1
Двигающийся DIV
    #35679934
armix2000
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
armix2000
Участник
Есть 2 DIV один содержит текст главной страницы сайта, второй невидимый, как сделать чтобы 2-ой див после клика на ссылку как бы выезжал справо налево и замещал 1-й див?
...
Рейтинг: 0 / 0
27.11.2008, 16:52
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35679982
Фотография Ренат
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ренат
Участник
как тут?
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
var anim_width;
var anim_type=Math.round(Math.random()* 2 );

function animMask(){
	if(anim_type== 0 ){
		anim_width=document.body.clientWidth;
		document.getElementById("pageLayout").style.left=anim_width+"px";
		document.getElementById("pageLayout").style.display="";
		setTimeout("_animMask()", 10 );
	}else if(anim_type== 1 ){
		anim_width=document.body.clientWidth;
		document.getElementById("pageLayout").style.left=(-anim_width)+"px";
		document.getElementById("pageLayout").style.display="";
		setTimeout("_animMask()", 10 );
	}else if(anim_type== 2 ){
		anim_width=document.body.clientHeight;
		document.getElementById("pageLayout").style.top=(anim_width)+"px";
		document.getElementById("loadMask").style.height=(anim_width)+"px";
		document.getElementById("pageLayout").style.display="";
		setTimeout("_animMask()", 10 );
		}
	return false;
	}
	

function _animMask(){
	if(anim_type== 0 ){
		anim_width-= 35 ;
		document.getElementById("pageLayout").style.left=anim_width+"px";
		document.getElementById("loadMask").style.width=(document.getElementById("loadMask").offsetWidth- 35 )+"px";
		if(anim_width> 35 ){
			setTimeout("_animMask()", 10 );
			}else{
			document.getElementById("loadMask").style.display="none";
			scroll_next(true);
			}
	}else if(anim_type== 1 ){
		anim_width-= 35 ;
		document.getElementById("pageLayout").style.left=-anim_width+"px";
		document.getElementById("loadMask").style.width=(document.getElementById("loadMask").offsetWidth- 35 )+"px";
		document.getElementById("loadMask").style.left=(document.getElementById("loadMask").offsetLeft+ 35 )+"px";
		if(anim_width> 35 ){
			setTimeout("_animMask()", 10 );
			}else{
			document.getElementById("loadMask").style.display="none";
			scroll_next(true);
			}
	}else if(anim_type== 2 ){
		anim_width-= 35 ;
		document.getElementById("pageLayout").style.top=anim_width+"px";
		document.getElementById("loadMask").style.height=(document.getElementById("loadMask").offsetHeight- 35 )+"px";
		if(anim_width> 35 ){
			setTimeout("_animMask()", 20 );
			}else{
			document.getElementById("loadMask").style.display="none";
			scroll_next(true);
			}
		}
	return false;
	}
Здесь pageLayout - твой главный контент, а loadMask - то что выезжает
Для "интересности" выезжать будет с 3х сторон
А вызываетсья так:
<a href=# onclick="return animMask()">тынц</a>
думаю мона код как нить даже покороче сделать
...
Рейтинг: 0 / 0
27.11.2008, 17:03
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35680173
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
IDVsbruck
Участник
Смысл столько городить, когда добавляя 16-килобайтную библиотеку jQuery, все это можно сделать одной строкой? К тому же это совершенно кроссбраузерно и скорость "выезда" можно регулировать.
...
Рейтинг: 0 / 0
27.11.2008, 17:57
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35680181
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
IDVsbruckСмысл столько городить, когда добавляя 16-килобайтную библиотеку jQuery, все это можно сделать одной строкой? К тому же это совершенно кроссбраузерно и скорость "выезда" можно регулировать.
Что правда - то правда. Хотя, я и не любитель жквери.
...
Рейтинг: 0 / 0
27.11.2008, 18:00
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35680185
Фотография Ренат
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ренат
Участник
Вы серьезно думаете что тот код что я написал весит больше 16кб???
зы. и тута три варианта выезда просто еще.
...
Рейтинг: 0 / 0
27.11.2008, 18:01
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35680195
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Ренат,

Не в этом дело, там просто уже реализована всякая анимация. Прикрутить её очень легко и в коде не надо разбираться. И примерчики есть. Для себя я бы тоже, ясен помидор, ручками написал.
...
Рейтинг: 0 / 0
27.11.2008, 18:05
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35680202
Фотография Ренат
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ренат
Участник
Аа, ну не так понял)
...
Рейтинг: 0 / 0
27.11.2008, 18:08
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35681280
armix2000
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
armix2000
Участник
IDVsbruckСмысл столько городить, когда добавляя 16-килобайтную библиотеку jQuery, все это можно сделать одной строкой? К тому же это совершенно кроссбраузерно и скорость "выезда" можно регулировать.

Киньте ссылку, я не нашел подобного на jquery.com!
...
Рейтинг: 0 / 0
28.11.2008, 11:12
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35681387
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Вот всякие примочки, на жквери, которые можно как есть целиком использовать. А в жквери есть анимация, которую просто использовать.
...
Рейтинг: 0 / 0
28.11.2008, 11:37
| Ответить | Цитировать | Написать  
Двигающийся DIV
    #35681960
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
IDVsbruck
Участник
Для базовой анимации (выезжания, затухания, свертывания и т.д.) дополнительные библиотеки не нужны - только базовая.
А лучшая русская дока по jQuery - это тут .

Что до кода - 16 кБ - это сущий пустяк, за который и вспоминать не надо. А если облегчит жизнь, то и 100 или 200 не надо. Но в коду смущает offset... - ведь поведение в при разных доктайпах разное, или client... - не все браузеры одинаково реагируют на эти атрибуты. Как с этим быть? И так далее ... Есть статические вещи, которые надо делать ручками, но анимация - не та вещь, которую надо выдумывать снова и снова.
...
Рейтинг: 0 / 0
28.11.2008, 14:07
| Ответить | Цитировать | Написать  
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Двигающийся DIV
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&fpage=310&tid=1455507]:
 0ms
get settings:
 7ms
get forum list:
 13ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 34ms
get topic data:
 8ms
get forum data:
 2ms
get page messages:
 41ms
get tp. blocked users:
 1ms
others: 232ms
total:  342ms
созд. / загр.: 342ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]