Как прятать элементы??

jevgensem

Его знают

Вне Форума

Сообщений: 128
Рига
Пол: male

Как прятать элементы??
01.11.2007 :: 16:13:10

Привет... снова нужна помощь.. Как сделать, чтобы можно было бы прятать элементы на странички.. Вот например как сдесь (показать смайлики/смайлики)

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!

Только хотелось бы сделать не так как там, а просто, при нажатии ссылки появлялось, при повторном нажатии пряталось.. Заранее спасибо ))

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !!
скачайте бесплатно проверенный софт с сервера из Латвии

IP записан

Ramzies Администратор Вне Форума Все что случается имеет причину. Сообщений: 2632 Даугавпилс, Валмиера. Пол:	Re: Как прятать элементы?? Ответ #1 - 01.11.2007 :: 16:17:18 Не совсем понял, объясни подробней. После 21:00 приду с учебы - помогу. Изменено: Ааа въехал. Я ссылку не заметил. Вобщем после 21:00 выложу код.
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь... IP записан

jevgensem Его знают Вне Форума Сообщений: 128 Рига Пол:	Re: Как прятать элементы?? Ответ #2 - 01.11.2007 :: 16:19:01 при нажатии на ссылку под ней появляется текст, при нажатии ещё раз на ссылку, этот текст пропадает..
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! скачайте бесплатно проверенный софт с сервера из Латвии IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #3 - 01.11.2007 :: 19:45:17

Все достаточно просто. Ну вот смотри.
Как сделать тег невидимым?
Для этого используется стиль display:none; его само собой можно вставить как в css так и в сам тег. В нашем случае будет проще и наглядней его вставить в тег, вот так: Код:

<span id="smile" style="display:none;">smailiki</span>

Вставив такую строчку в html мы не увидим текст smailiki.
Можно использовать не span, это не столь принципиально. Если мы в style, display сменим на block.
Пример: Код:

<span id="smile" style="display: block;">smailiki</span>

Строчка станет видима.

Через JavaScript это делается так так:
Невидим Код:

document.getElementById('smile').style.display = "none";

Видим Код:

document.getElementById('smile').style.display = "block";

Осталось написать JavaScript который будет проверять наш span и делать его видимым/невидимым.

Это можно сделать так: JavaScript Код:

function showAndHide() {
if(document.getElementById('smile').style.display == "none")
   document.getElementById('smile').style.display = "block";
else
   document.getElementById('smile').style.display = "none";
return false;
}

Ну и кнопочка с нашими смайликами: HTML Код:

<a href="#" onclick="showAndHide()">off/on</a>
<span id="smile" style="display:none;">smailiki</span>

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

jevgensem

Его знают

Вне Форума

Сообщений: 128
Рига
Пол: male

Re: Как прятать элементы??
Ответ #4 - 02.11.2007 :: 13:42:00

спасибо, работает ))

а если много элементов, куда их вписывать, так чтоли?

Код:

function showAndHide() {
if(document.getElementById('smile').style.display == "none")
   document.getElementById('smile').style.display = "block";
else
   document.getElementById('smile').style.display = "none";
return false;
}
if(document.getElementById('d').style.display == "none")
   document.getElementById('d').style.display = "block";
else
   document.getElementById('d').style.display = "none";
return false;
}

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !!
скачайте бесплатно проверенный софт с сервера из Латвии

IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #5 - 02.11.2007 :: 14:11:02

Можно и так, но лучше вот так:
JavaScript Код:

function showAndHide(objId) {
if(document.getElementById(objId).style.display == "none")
   document.getElementById(objId).style.display = "block";
else
   document.getElementById(objId).style.display = "none";
return false;
}

HTML Код:

<a href="#" onclick="showAndHide('smile')">off/on</a>
<span id="smile" style="display:none;">smailiki</span>
<a href="#" onclick="showAndHide('test')">off/on</a>
<span id="test" style="display:none;">test</span>

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

jevgensem Его знают Вне Форума Сообщений: 128 Рига Пол:	Re: Как прятать элементы?? Ответ #6 - 02.11.2007 :: 14:59:58 Спасибо большое, Ramzes! А можно както сделать, что при открытии второго элемента, первый пропадал?
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! скачайте бесплатно проверенный софт с сервера из Латвии IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #7 - 02.11.2007 :: 16:25:50

JavaScript Код:

function showAndHide(objId, clos) {
if(document.getElementById(objId).style.display == "none") {
   document.getElementById(objId).style.display = "block";
   document.getElementById(clos).style.display = "none"; }
else
   document.getElementById(objId).style.display = "none";
return false;
}

HTML Код:

<a href="#" onclick="showAndHide('smile', 'test')">off/on</a>
<span id="smile" style="display:none;">smailiki</span>

<a href="#" onclick="showAndHide('test', 'smile')">off/on</a>
<span id="test" style="display:none;">test</span>

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

jevgensem Его знают Вне Форума Сообщений: 128 Рига Пол:	Re: Как прятать элементы?? Ответ #8 - 04.11.2007 :: 19:20:35 спасибо
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! скачайте бесплатно проверенный софт с сервера из Латвии IP записан

jevgensem Его знают Вне Форума Сообщений: 128 Рига Пол:	Re: Как прятать элементы?? Ответ #9 - 10.08.2008 :: 21:43:10 Ramzies, будь другом, подскажи, а как сделать чтобы он плавно показывался и скрывался? Ну как у тебя на сайте... Или это фирменный секрет? Или через ajax как то?
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! скачайте бесплатно проверенный софт с сервера из Латвии IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #10 - 11.08.2008 :: 10:42:12

jevgensem писал(а) 10.08.2008 :: 21:43:10:

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

Или через ajax как то?

Привет. Я юзаю Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
библиотеку.

Здесь документация с примерами как это работает Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!

P.S. Если не разберешься, пиши, помогу.

Только лучше создаю новую тему по jquery с show.

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

jevgensem Его знают Вне Форума Сообщений: 128 Рига Пол:	Re: Как прятать элементы?? Ответ #11 - 11.08.2008 :: 17:51:17 спасибо, но там немного не понятно. образцы скрипта для показа элементов и прятанья элементов отдельно... а как чтобы при нажатии появлялся, потом при нажатии пропадал?
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! скачайте бесплатно проверенный софт с сервера из Латвии IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #12 - 12.08.2008 :: 21:06:41

Наверное тебе будет проще если я покажу на старом примере: Код:

function showAndHide(objId) {
if(document.getElementById(objId).style.display == "none")
   document.getElementById(objId).style.display = "block";
else
   document.getElementById(objId).style.display = "none";
return false;
}
<a href="#" onclick="showAndHide('smile')">off/on</a>
<span id="smile" style="display:none;">smailiki</span>
<a href="#" onclick="showAndHide('test')">off/on</a>
<span id="test" style="display:none;">test</span>

Его мы разбирали помоему тут было все понятно.
А теперь мы вместо старой функции которая открывает скрытую html разметку: Код:

document.getElementById(objId).style.display = "block";

Вставляем функцию из jquery. Вот так: Код:

$("#"+objId).show();

Также и с функцией: Код:

document.getElementById(objId).style.display = "none";

(которая скрывает html элементы) заменяем на Код:

$("#"+objId).hide();

Все вместе это будет выглядеть так: Код:

function showAndHide(objId) {
if(document.getElementById(objId).style.display == "none")
$("#"+objId).show();
else
$("#"+objId).hide();
return false;
}

<a href="#" onclick="showAndHide('smile')">off/on</a>
<span id="smile" style="display:none;">smailiki</span>
<a href="#" onclick="showAndHide('test')">off/on</a>
<span id="test" style="display:none;">test</span>

В скобках show() и hide() можно еще задавать время с которым будут открываться или закрываться элементы. Пример: show(100) и hide(100).

Да и самое главное, не забудь скачать и подгрузить саму jquery библиотеку на страницах где используешь этот скрипт.

Последняя доступная версия 1.2.6 (Release Notes)
Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
, Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
, Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
. Я юзаю Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
.

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

jevgensem Его знают Вне Форума Сообщений: 128 Рига Пол:	Re: Как прятать элементы?? Ответ #13 - 12.10.2008 :: 15:48:48 Опа, и не работает, может это из за того что у меня DLE P.S. твой пример тоже не работает
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! скачайте бесплатно проверенный софт с сервера из Латвии IP записан

Ramzies Администратор Вне Форума Все что случается имеет причину. Сообщений: 2632 Даугавпилс, Валмиера. Пол:	Re: Как прятать элементы?? Ответ #14 - 12.10.2008 :: 15:52:15 jevgensem писал(а) 12.10.2008 :: 15:48:48: Опа, и не работает, может это из за того что у меня DLE Что такое DLE? Покажи страничку где не работает, вечером посмотрю.
Наверх	Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в или !! Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь... IP записан

WHacker

Предмет симпатий

Вне Форума

ololo

Сообщений: 214
Латвия
Пол: male

Re: Как прятать элементы??
Ответ #15 - 13.08.2009 :: 09:16:16

У меня вопрос по 7-му ответу. А можно ли зделать так что бы по стандарту показывало первый текст, в нашем случае - "smailiki"?
И можно ли сделать так что бы допустим тискаем мы "<a href="#" onclick="showAndHide('test', 'smile')">off/on</a>" и "smailiki" пропадает, а появляеться "test", но что бы при повторном нажатии "test" не пропадал, что б вообще нечего не происходило, а при нажатии на "<a href="#" onclick="showAndHide('smile', 'test')">off/on</a>" "test" пропадал бы и снова показывало - "smailiki".
Так же можно ли сделать с 1 кнопки 2 элемента?
Типо:
Код:

<a href="#" onclick="showAndHide('smile', 'test')">off/on</a>
<span id="smile" style="display:none;">smailiki_1</span>
<span id="smile" style="display:none;">smailiki_2</span>

Мм..? Я так пробовал - открывало только первое... Толи криво пробовал толи я незнаю что.

Наверх

IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #16 - 13.08.2009 :: 10:06:25

WHacker писал(а) 13.08.2009 :: 09:16:16:

У меня вопрос по 7-му ответу. А можно ли зделать так что бы по стандарту показывало первый текст, в нашем случае - "smailiki"?

Можно, нужно всего лишь с нужного тебе span (который хочешь что б показывался по стандарту) убрать display:none;
Код:

<span id="smile" style="display:none;">smailiki</span>

<span id="test" style="display:none;">test</span>

Цитата:

И можно ли сделать так что бы допустим тискаем мы "<a href="#" onclick="showAndHide('test', 'smile')">off/on</a>" и "smailiki" пропадает, а появляеться "test", но что бы при повторном нажатии "test" не пропадал, что б вообще нечего не происходило, а при нажатии на "<a href="#" onclick="showAndHide('smile', 'test')">off/on</a>" "test" пропадал бы и снова показывало - "smailiki".

Можно, нужно удалить то что я пометил желтым: Код:

function showAndHide(objId, clos) {
if(document.getElementById(objId).style.display == "none") {
   document.getElementById(objId).style.display = "block";
   document.getElementById(clos).style.display = "none"; }
else
   document.getElementById(objId).style.display = "none";
return false;
}

Цитата:

Так же можно ли сделать с 1 кнопки 2 элемента?
Типо:
Код:

<a href="#" onclick="showAndHide('smile', 'test')">off/on</a>
<span id="smile" style="display:none;">smailiki_1</span>
<span id="smile" style="display:none;">smailiki_2</span>

Нельзя, id должен быть всегда уникальным. А зачем тебе это?

Наверх

« Последняя редакция: 13.08.2009 :: 17:18:39 от Ramzies »

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

WHacker Предмет симпатий Вне Форума ololo Сообщений: 214 Латвия Пол:	Re: Как прятать элементы?? Ответ #17 - 13.08.2009 :: 13:34:47 Цитата: А зачем тебе это? Ну это как бы страховка была бы... Типо я б сделал что бы когда мы включаем test он накладывает на код smailik'ов "/--- smailiki ---/" типо того.
Наверх	IP записан

WHacker

Предмет симпатий

Вне Форума

ololo

Сообщений: 214
Латвия
Пол: male

Re: Как прятать элементы??
Ответ #18 - 13.08.2009 :: 13:37:58

Цитата:

Можно, нужно удалить то что я пометил желтым: Код:

function showAndHide(objId, clos) {
if(document.getElementById(objId).style.display == "none") {
   document.getElementById(objId).style.display = "block";
   document.getElementById(clos).style.display = "none"; }
else
   document.getElementById(objId).style.display = "none";
return false;
}

Что то я сомневаюсь что "}" последнюю тоже надо стереть... Язык

Наверх

« Последняя редакция: 13.08.2009 :: 17:18:14 от Ramzies »

IP записан

WHacker Предмет симпатий Вне Форума ololo Сообщений: 214 Латвия Пол:	Re: Как прятать элементы?? Ответ #19 - 13.08.2009 :: 13:45:06 Блин, я как только уже не пробовал и нечего не работает... Ты б хоть сам проверил как это у тебя работает. Но мне это очень надо...
Наверх	IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #20 - 14.08.2009 :: 00:07:04

WHacker писал(а) 13.08.2009 :: 13:37:58:

Цитата:

Можно, нужно удалить то что я пометил желтым: Код:

function showAndHide(objId, clos) {
if(document.getElementById(objId).style.display == "none") {
   document.getElementById(objId).style.display = "block";
   document.getElementById(clos).style.display = "none"; }
else
   document.getElementById(objId).style.display = "none";
return false;
}

Что то я сомневаюсь что "}" последнюю тоже надо стереть... Язык

Да ее не стоит стирать.

WHacker писал(а) 13.08.2009 :: 13:45:06:

Блин, я как только уже не пробовал и нечего не работает... Улыбка

Ты б хоть сам проверил как это у тебя работает. Плачущий

Но мне это очень надо... Улыбка

Все работает. Ты наверное просто так и не понял принцип работы. Нужно внимательней читать что тебе пишут.

Код:

<a href="#" onclick="showAndHide('smile', 'test')">off/on</a>

Эта кнопка работает так: В скобках ('smile', 'test') пишутся id span-ов, тоесть в данном случае при нажатие на такую кнопку span с id = smile, если невидим делаем видимым, а span с test автоматически делается невидимым.

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан

WHacker

Предмет симпатий

Вне Форума

ololo

Сообщений: 214
Латвия
Пол: male

Re: Как прятать элементы??
Ответ #21 - 14.08.2009 :: 12:30:44

Если что я сделал что хотел, вот можешь посмотреть - Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!

P.S.: Отлистай в самый низ.

Наверх

IP записан

Ramzies

Администратор

Вне Форума

Все что случается
имеет причину.

Сообщений: 2632
Даугавпилс, Валмиера.
Пол: male

Re: Как прятать элементы??
Ответ #22 - 14.08.2009 :: 22:45:54

WHacker писал(а) 14.08.2009 :: 12:30:44:

Если что я сделал что хотел, вот можешь посмотреть - Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!

Молодец, хотя тоже самое можно было сделать и с этим примером.

Цитата:

P.S.: Отлистай в самый низ.

На форуме можно делать автоматически отмотку на нужное сообщение для этого в верху нужного сообщения нужно счелкнуть на Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
и скопировать url.

Наверх

Просмотр медиа-файлов и переход по ссылкам доступен только для Участников Форума! Вы нуждаетесь в

или

!!
Научись говорить, что ты _х_о_ч_е_ш_ь, вместо точго, чего ты _н_е_ _х_о_ч_е_ш_ь...

IP записан