Помогите сделать плавное "выдвижение"

Уни · 12.04.2008, 11:21

Люди, помогите! Срочно нужно сделать так, чтобы элемент, в данном случае блок текста, изначально, когда страница загрузилась, был невидим, а после щелчка мыши по заголовку он как бы плавно выезжал сверху и после еще одного щелчка "уезжал" опять вверх и снова становился невидимым. Так сделано "vkontakte.ru". Я немного познакомилась со свойством display и у меня этот элемент после щелчка просто появляется и исчезает, а мне надо чтобы он плавно выдвигался и задвигался и чтобы, примерно как ниспадающее меню, но только чтобы он неперекрывал текст находящийся ниже. Вот.

Подскажите пожалуйста, как это можно сделать.
И еще один вопрос. Можно ли сделать рамку вокруг текста с скругленными углами и чтобы она плавно загоралась и снова исчезала? Заранее спасибо.

Асмодиан · 12.04.2008, 11:43

Вообщето я бы вам посоветовал mootools.
Например так: http://demos.mootools.net/Fx.Slide

Уни · 12.04.2008, 11:56

Ну примерно это мне и нужно, но как это реализовать?

Асмодиан · 12.04.2008, 11:59

На указанной мной странице есть кнопочки: js code, html code, css code.
Смотрим туда - там всё написанно.
Потом качаем сам mootools (download), подключаем к своей страничке и пишем код, наподобии указанного...

Уни · 12.04.2008, 12:17

Я скачала, что-то подозрительно мало весит, так и надо?

JavaScript файл. И что делать дальше? Как подключить к моим страницам? Извиняюсь за, наверно, тупые вопросы, просто я новичок в этом деле.

Асмодиан · 12.04.2008, 12:26

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
...
<script type="text/javascript" language="javascript" src="нужный скрипт"></script>
...
</head>
...

Кстати, а всё ли вы скачали? все ли нужные вам галочки поставили?
Там по-любому скачивается лишь 1 файл, но нужно поставить нужные галки...

Добавлено через 44 секунды

PS. Вместо нужный скрипт, указываете путь к файлу скрипта

Уни · 12.04.2008, 13:06

Первый раз скачала только один файл. Но потом до меня дошло поставить везде галочки.

Но все равно общий размер где-то 64кб. Спасибо, буду пробовать!

Добавлено через 35 минут

Я сделала все как вы сказали, но ничего не происходит, текст не убирается ни появляется.Почему так может быть?

Vovka · 13.04.2008, 16:13

Не хочу показатся невежливо грубым, но как я понимаю, там должны быть "слайдящиеся" объекты с нужными айдишниками или чтото типа того... Сам факт подключения скрипта не гарантирует нужного эффекта. Нужно указать еще айдишники в хтмл.

Асмодиан · 13.04.2008, 21:14

Меня спросили, как ПОДКЛЮЧИТЬ файл, я и ответил
а код нужно написать, основываясь на примере из указанной мной страницы.

--------------------------------------------------------------------------------

На указанной мной странице есть кнопочки: js code, html code, css code.

Уни · 27.04.2008, 10:44

Здравствуйте! Недавно я спрашивала как сделать "выдвижение" блока. С этим я разобралась, скачала

mootools и все работает. Но теперь мне нужно, чтобы при открытии-"выдвижении" одного блока, другой

открытый подобный блок наоборот уезжал-"закрывался".

Т.е. у меня на странице несколько таких

ссылок, при нажатии которых выезжает текст и мне надо чтобы когда открываешь одну ссылку, другая

открытая наооборот закрывалась. Таким образом, на странице одновременно не должно быть более

одной открытой ссылки. И еще желательно, чтобы страница сама прокручивалась так, чтобы эта

открытая ссылка оказывалась вверху. Не подскажите как это сделать?

Вот код функции, с которой у

меня все работает, но его надо как-то изменить:
var mySlide = new Fx.Slide('test',{duration:2000}).hide();
$('toggle').addEvent('click', function(e){
e = new Event(e);
mySlide.toggle();
e.stop();
});

И такая функция у меня висит на каждой ссылке.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Как сделать "замедленную реакцию" при наведении на блок в css3?	Владимир2	HTML, CSS, JavaScript	3	20.07.2014 06:29
"Оцените, господа!" или "Когда клиент через год переоценивает взгляды"	()@ZI$	Зал дебютантов	15	30.11.2005 09:50
Продажа билетов лотерей "Золотой ключ", "Русское Лото", "ТВ Бинго-шоу"	Florid	Кальянная	1	22.08.2005 19:24
Очень бы хотелось услышать советы "бывалых" и "знающих"	tim	Зал дебютантов	10	10.05.2004 09:48

12.04.2008, 11:21	#1
Уни	Люди, помогите! Срочно нужно сделать так, чтобы элемент, в данном случае блок текста, изначально, когда страница загрузилась, был невидим, а после щелчка мыши по заголовку он как бы плавно выезжал сверху и после еще одного щелчка "уезжал" опять вверх и снова становился невидимым. Так сделано "vkontakte.ru". Я немного познакомилась со свойством display и у меня этот элемент после щелчка просто появляется и исчезает, а мне надо чтобы он плавно выдвигался и задвигался и чтобы, примерно как ниспадающее меню, но только чтобы он неперекрывал текст находящийся ниже. Вот. Подскажите пожалуйста, как это можно сделать. И еще один вопрос. Можно ли сделать рамку вокруг текста с скругленными углами и чтобы она плавно загоралась и снова исчезала? Заранее спасибо.

12.04.2008, 11:43	#2
Асмодиан	Вообщето я бы вам посоветовал mootools. Например так: http://demos.mootools.net/Fx.Slide

12.04.2008, 11:56	#3
Уни	Ну примерно это мне и нужно, но как это реализовать?

12.04.2008, 11:59	#4
Асмодиан	На указанной мной странице есть кнопочки: js code, html code, css code. Смотрим туда - там всё написанно. Потом качаем сам mootools (download), подключаем к своей страничке и пишем код, наподобии указанного...

12.04.2008, 12:17	#5
Уни	Я скачала, что-то подозрительно мало весит, так и надо? JavaScript файл. И что делать дальше? Как подключить к моим страницам? Извиняюсь за, наверно, тупые вопросы, просто я новичок в этом деле.

12.04.2008, 12:26	#6
Асмодиан	<html xmlns="http://www.w3.org/1999/xhtml"> <head> ... <script type="text/javascript" language="javascript" src="нужный скрипт"></script> ... </head> ... Кстати, а всё ли вы скачали? все ли нужные вам галочки поставили? Там по-любому скачивается лишь 1 файл, но нужно поставить нужные галки... Добавлено через 44 секунды PS. Вместо нужный скрипт, указываете путь к файлу скрипта Последний раз редактировалось Асмодиан; 12.04.2008 в 12:26.. Причина: Добавлено сообщение

12.04.2008, 13:06	#7
Уни	Первый раз скачала только один файл. Но потом до меня дошло поставить везде галочки. Но все равно общий размер где-то 64кб. Спасибо, буду пробовать! Добавлено через 35 минут Я сделала все как вы сказали, но ничего не происходит, текст не убирается ни появляется.Почему так может быть? Последний раз редактировалось Уни; 12.04.2008 в 13:06.. Причина: Добавлено сообщение

13.04.2008, 16:13	#8
Vovka	Не хочу показатся невежливо грубым, но как я понимаю, там должны быть "слайдящиеся" объекты с нужными айдишниками или чтото типа того... Сам факт подключения скрипта не гарантирует нужного эффекта. Нужно указать еще айдишники в хтмл.

13.04.2008, 21:14	#9
Асмодиан	Меня спросили, как ПОДКЛЮЧИТЬ файл, я и ответил а код нужно написать, основываясь на примере из указанной мной страницы. -------------------------------------------------------------------------------- На указанной мной странице есть кнопочки: js code, html code, css code.

27.04.2008, 10:44	#10
Уни	Здравствуйте! Недавно я спрашивала как сделать "выдвижение" блока. С этим я разобралась, скачала mootools и все работает. Но теперь мне нужно, чтобы при открытии-"выдвижении" одного блока, другой открытый подобный блок наоборот уезжал-"закрывался". Т.е. у меня на странице несколько таких ссылок, при нажатии которых выезжает текст и мне надо чтобы когда открываешь одну ссылку, другая открытая наооборот закрывалась. Таким образом, на странице одновременно не должно быть более одной открытой ссылки. И еще желательно, чтобы страница сама прокручивалась так, чтобы эта открытая ссылка оказывалась вверху. Не подскажите как это сделать? Вот код функции, с которой у меня все работает, но его надо как-то изменить: var mySlide = new Fx.Slide('test',{duration:2000}).hide(); $('toggle').addEvent('click', function(e){ e = new Event(e); mySlide.toggle(); e.stop(); }); И такая функция у меня висит на каждой ссылке.