Нужна подсказка чтоб доделать скрытие/показ контента в материале

spot

Захожу иногда
58
0 / 0
Linux - долой форточки

Нужна подсказка чтоб доделать скрытие/показ контента в материале

« : 20.05.2009, 13:46:39 »

Задача: для всех пользователей сделать так чтобы, к примеру, по нажатию на надпись "Все фото" снизу появлялась табличка с фотками или какой нибудь текст.
Перебрав кучу модулей, плагинов и т.п. для скрытия/показа контента, решил все сделать старым лобрым способом - ручками

Нашел в сети удачное решение - Java script. Вот как выглядит он:

Код


<script type="text/javascript">
function myHide() {
document.getElementById('myBlock').style.display = "none";
}
function myShow() {
document.getElementById('myBlock').style.display = "block";
}
</script>

Его я запихнул в шаблон между <head></head>
Далее код для страницы:

Код


<a onclick="myShow(); return false;" href="#">Все фото[+]</a>
<a onclick="myHide(); return false;" href="#">[-]</a>
<div id="myBlock" style="border: 1px solid rgb(0, 0, 0); width: 100%;">
Тут размещаем таблицу с картинками или текст
</div>

После этого у меня на странице появилась надпись "Все фото + -". При нажатии на - информация "Тут размещаем таблицу с картинками или текст" скрывается, при нажатии на "Все фото +" - появляется.

Просьба: Подскажите как изменить код так чтоб была только надпись "Все фото" и открытие/скрытие происходило по нажатию на ней. (не очень удобно тыкать на + или -). И еще одно - почему-то информация по умолчанию развернута, хотелось бы чтоб была по умолчанию скрыта.

Всем огромное спасибо, заранее.

Записан

dimsa

Захожу иногда
135
32 / 0

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #1 : 20.05.2009, 13:49:50 »

А почему вместо такого решения не использовать эффект слайдера? плагины, которые это реализуют есть. вопрос оформления подгонишь стилями.... + к тому же слайдер всегда отображается в закрытом состоянии!

Записан

Верьте в будущее и оно наступит.

beliyadm

Легенда
9758
1665 / 66
Севастополь, Россия

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #2 : 20.05.2009, 13:50:16 »

Код


<script type='text/javascript'>
		function showHide()
		{
		    if ( document.getElementById('myDiv').style.display == 'block' )
		        document.getElementById('myDiv').style.display = 'none';
		    else
		        document.getElementById('myDiv').style.display = 'block';
		}
		function showHide2()
		{
		    if ( document.getElementById('myDiv2').style.display == 'block' )
		        document.getElementById('myDiv2').style.display = 'none';
		    else
		        document.getElementById('myDiv2').style.display = 'block';
		}
</script>
<div onclick="showHide()" style="cursor: pointer;">+ click to show/hide 1</div>
<div id="myDiv" style="text-align: left; display:none; border: 1px solid #ccc; width: 200px; padding: 4px;">
view hide text  view hide text view hide text view hide text view hide text view hide text
</div>
<br /><br />
<div onclick="showHide2()" style="cursor: pointer;">+ click to show/hide 2</div>
<div id="myDiv2" style="text-align: left; display:none; border: 1px solid #ccc; width: 200px; padding: 4px;">

view hide text2  view hide text2 view hide text2 view hide text2 view hide text2 view hide text2
</div>

и я недавно для 1.5 писал плагин спойлера http://joomlaforum.ru/index.php/topic,64949.0.html, при желании можете переписать под 1.0

Записан

Все истины, которые я хочу вам изложить, — бесстыдная ложь. Сделать всё хорошо
TLG: @Beliyadm

spot

Захожу иногда
58
0 / 0
Linux - долой форточки

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #3 : 20.05.2009, 14:07:19 »

Цитата: beliyadm от 20.05.2009, 13:50:16

Код


<script type='text/javascript'>
		function showHide()
		{
		    if ( document.getElementById('myDiv').style.display == 'block' )
		        document.getElementById('myDiv').style.display = 'none';
		    else
		        document.getElementById('myDiv').style.display = 'block';
		}
		function showHide2()
		{
		    if ( document.getElementById('myDiv2').style.display == 'block' )
		        document.getElementById('myDiv2').style.display = 'none';
		    else
		        document.getElementById('myDiv2').style.display = 'block';
		}
</script>
<div onclick="showHide()" style="cursor: pointer;">+ click to show/hide 1</div>
<div id="myDiv" style="text-align: left; display:none; border: 1px solid #ccc; width: 200px; padding: 4px;">
view hide text  view hide text view hide text view hide text view hide text view hide text
</div>
<br /><br />
<div onclick="showHide2()" style="cursor: pointer;">+ click to show/hide 2</div>
<div id="myDiv2" style="text-align: left; display:none; border: 1px solid #ccc; width: 200px; padding: 4px;">

view hide text2  view hide text2 view hide text2 view hide text2 view hide text2 view hide text2
</div>

Извини я не очень в программировании - учусь только. Расскажи что у тебя такое showHide() и showHide2(). Я понимаю что это функции, но что происходит при их работе т.е. если я запихну этот код к себе что будет с инфой "view hide text" и "view hide text2"?
Спасибо за быстрый дельный ответ. 2beliyadm ты меня уже не раз выручал - спасибо и +1

Записан

beliyadm

Легенда
9758
1665 / 66
Севастополь, Россия

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #4 : 20.05.2009, 14:26:19 »

Цитата: spot от 20.05.2009, 14:07:19

Извини я не очень в программировании - учусь только. Расскажи что у тебя такое showHide() и showHide2(). Я понимаю что это функции, но что происходит при их работе т.е. если я запихну этот код к себе что будет с инфой "view hide text" и "view hide text2"?

а ты возьми целиком этот код и посмотри на работу.
Это две функции, потому что в этом примере два раскрывающихся блока (myDiv и myDiv2)

Записан

Все истины, которые я хочу вам изложить, — бесстыдная ложь. Сделать всё хорошо
TLG: @Beliyadm

spot

Захожу иногда
58
0 / 0
Linux - долой форточки

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #5 : 20.05.2009, 14:46:47 »

Не получилось, может, что-то не так сделал. Я взял скрипт:

Код


<script type='text/javascript'>
		function showHide()
		{
		    if ( document.getElementById('myDiv').style.display == 'block' )
		        document.getElementById('myDiv').style.display = 'none';
		    else
		        document.getElementById('myDiv').style.display = 'block';
		}
		function showHide2()
		{
		    if ( document.getElementById('myDiv2').style.display == 'block' )
		        document.getElementById('myDiv2').style.display = 'none';
		    else
		        document.getElementById('myDiv2').style.display = 'block';
		}
</script>

В ставил между Его я запихнул в шаблон между <head></head>
А остальной код:

Код


<div onclick="showHide()" style="cursor: pointer;">+ click to show/hide 1</div>
<div id="myDiv" style="text-align: left; display:none; border: 1px solid #ccc; width: 200px; padding: 4px;">
view hide text  view hide text view hide text view hide text view hide text view hide text
</div>
<br /><br />
<div onclick="showHide2()" style="cursor: pointer;">+ click to show/hide 2</div>
<div id="myDiv2" style="text-align: left; display:none; border: 1px solid #ccc; width: 200px; padding: 4px;">

view hide text2  view hide text2 view hide text2 view hide text2 view hide text2 view hide text2
</div>

залил на страницу.
На странице есть надписи + click to show/hide 1 и + click to show/hide 2 а не нажимаются и никакого эффекта.

Записан

MuraDweb

Захожу иногда
267
124 / 1

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #6 : 20.05.2009, 15:24:02 »

Я вот пользовал такую распространённую "конструкцию"

Код: javascript


<script language="javascript" type="text/javascript">
//<![CDATA[
 function SwitchMenu(obj) {
  if(document.getElementById) {
    var el = document.getElementById(obj);
      var ar = document.getElementById("menu_down_up").getElementsByTagName("DIV");
	    if(el.style.display == "none") {
	   for (var i=0; i<ar.length; i++) {
	 ar[i].style.display = "none";
	 }
	el.style.display = "block";
	} else {
		el.style.display = "none";
		}
	  }
	}
//]]>
</script>

<span class="link" id="menu_down_up" onclick="SwitchMenu('sub_0')" title="Показать Текст 1">Нажми на меня №1</span>
<div class="submenu" id="sub_0" style="display: none;">
	Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 
	Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 
	Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 
	Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 Текст 1 
</div>

<br />

<span class="link" id="menu_down_up" onclick="SwitchMenu('sub_1')" title="Показать Текст 2">Нажми на меня №2</span>

<div class="submenu" id="sub_1" style="display: none;">
	Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 
	Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 
	Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 
	Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 Текст 2 
</div>

Записан

spot

Захожу иногда
58
0 / 0
Linux - долой форточки

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #7 : 20.05.2009, 15:57:23 »

Цитата: MuraDweb от 20.05.2009, 15:24:02

Я вот пользовал такую распространённую "конструкцию"

Блин, тоже не сработало.. Сделал тоже самое: скрипт в index.php в раздел <head> а код - на страницу. Показывает надпись "Нажми на меня №1" и все, никаких действий.
Ребята, что я делаю не так?

Записан

MuraDweb

Захожу иногда
267
124 / 1

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #8 : 20.05.2009, 16:05:39 »

Javascript`ы хоть разрешены в браузере?
Ибо всё должно работать.
Код на страницу, как вставляешь?
Если через редактор, попробуй его отключить (поставь простой html).

Короче вставь весь код напрямую в index, если не сработает значит у тебя проблемы какие-то с бравзером.

« Последнее редактирование: 20.05.2009, 16:08:45 от MuraDweb »

Записан

spot

Захожу иногда
58
0 / 0
Linux - долой форточки

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #9 : 20.05.2009, 16:10:34 »

Цитата: MuraDweb от 20.05.2009, 16:05:39

Javascript`ы хоть разрешены в браузере?
Ибо всё должно работать.
Код на страницу, как вставляешь?
Если через редактор, попробуй его отключить (поставь простой html).

Java разрешена 100% (перепроверил, да и мой первый вариант работает...), вставляю код через кнопку html в редакторе и в открывшемся окошке ввожу код. Все, как обычно. Х.з. чего не работает. А очень надо сделать чтоб открывался/скрывался кликами по одной надписи.

Записан

MuraDweb

Захожу иногда
267
124 / 1

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #10 : 20.05.2009, 16:25:00 »

Цитата: MuraDweb от 20.05.2009, 16:05:39

Если через редактор, попробуй его отключить (поставь простой html).

Так пробывал?

Записан

spot

Захожу иногда
58
0 / 0
Linux - долой форточки

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #11 : 20.05.2009, 16:35:33 »

Цитата: MuraDweb от 20.05.2009, 16:25:00

Так пробывал?

Только что попробывал - РАБОТАЕТ!!!
Причем работает и вариант который предложил господин beliyadm!!!!!
Только не пойму теперь почему через редактор не работает?

Все, всем СПАСИБО! Тему можно закрыть. Всем новичкам, как я успехов.

« Последнее редактирование: 20.05.2009, 16:39:00 от spot »

Записан

MuraDweb

Захожу иногда
267
124 / 1

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

« Ответ #12 : 20.05.2009, 16:43:15 »

Цитата: spot от 20.05.2009, 16:35:33

Только не пойму теперь почему через редактор не работает?

Ну это много раз обсуждалось на форуме.

Удачи !!!

Записан

Скрытие/замена реальных ссылок на файлы. Автор DK-Scorp	Ответов: 0 Просмотров: 1918	03.10.2012, 01:17:48 от DK-Scorp
Две колонки текста в материале статьи Автор Trok	Ответов: 7 Просмотров: 9279	25.03.2011, 13:37:44 от klubnichkaaa
как изменить количество колонок в материале? Автор Van4o	Ответов: 1 Просмотров: 3449	22.12.2010, 20:57:52 от vikingg
Как убрать дату, автора и дату последнего обновления контента Автор Gvin	Ответов: 3 Просмотров: 3000	03.11.2009, 16:57:48 от beliyadm
Можно автоматизировать добавление контента? Автор Rojas	Ответов: 2 Просмотров: 2604	29.10.2009, 01:31:01 от Rojas

Нужна подсказка чтоб доделать скрытие/показ контента в материале - Joomla 1.0: Общие вопросы

Новости Joomla

Новый способ добавления и рендера полей в Joomla Form - метод renderControlFields() (Joomla 5.3+)

Joomla: как тестировать? Всего 8 минут

JoomGallery 4.1.0 - компонент галереи изображений для Joomla

v.4.1.0. Что нового?

spot

Нужна подсказка чтоб доделать скрытие/показ контента в материале

dimsa

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

beliyadm

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

spot

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

beliyadm

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

spot

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

MuraDweb

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

spot

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

MuraDweb

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

spot

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

MuraDweb

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

spot

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

MuraDweb

Re: Нужна подсказка чтоб доделать скрытие/показ контента в материале

Похожие темы