Загрузка и удаление содержимого
Имеется 4 ссылки вида:
<ul> <li><a class="" href="#"data-filter=".h">H</a></li> <li><a class="" href="#"data-filter=".ha">Ha</a></li> <li><a class="" href="#"data-filter=".has">Has</a></li> <li><a class="" href="#"data-filter=".hasd">Hasd</a></li> </ul> как сделать, чтоб при нажатии на первую ссылку, появлялся блок с текстом <p class="h">Текст1</p>, при клике на вторую ссылку <p class="ha">Текст2</p> , грузиться второй блок, удаляя при этом блок 1. и т.д с каждой, один блок загружается , другие убираются ? |
Грузится откуда? Блоки много текста содержат?
|
Текста 3-4 предложения.
они не грузятся откуда то. просто один появляется, другой принимает свойство display:none к примеру |
AdDa,
таких именно открывашек 100500 на форуме -- а поискать? |
Искал, не те попадались какие то..
|
AdDa,
100501 <!DOCTYPE HTML> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> p { display: none; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script> $(function(){ var s = $("a[data-filter]"), p = $('p[class^="h"]'); s.click(function(event) { event.preventDefault(); var filter = $(this).data("filter"); p.stop().not(filter).hide(); p.filter(filter).fadeToggle(1500); }); }); </script> </head> <body> <ul> <li><a class="" href="#"data-filter=".h">H</a></li> <li><a class="" href="#"data-filter=".ha">Ha</a></li> <li><a class="" href="#"data-filter=".has">Has</a></li> <li><a class="" href="#"data-filter=".hasd">Hasd</a></li> </ul> <p class="h">Текст h</p> <p class="ha">Текст ha</p> <p class="has">Текст has</p> <p class="hasd">Текст hasd</p> </body> </html> |
ТО что НАДО Бро! )
Спасиб огромное! |
А почему бы вместо class не использовать id, а в ссылках, вместо data-filter писать href="#has" ? Зачем придумывать велосипед?
|
Рони, извини, у меня кароч с фильтрами в моем дОке не пашет, там уже используются фильтры и оно перебивается там...
<ul id="filters" class="unstyled"> <li><a href="#" data-filter="*" class="selected hasd">Все вертикальные</a></li> <li><a href="# "data-filter=".Briz_category" id="Briz_category">Бриз</a></li> <li><a href="# "data-filter=".Multifakturnye_category">Мульти</a></li> <li><a href="# "data-filter=".fotonan_category">Фото</a></li> </ul> это сортировка фотографий,... и вот при нажатии на каждую из ссылок подгружаются фото и надо чтоб сверху подгружался Текст описания <p>Текст</p> |
AdDa,
Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. не понял ни тебя ни danik.js, danik.js, если вам нетрудно сделайте кодом, про что вы сказали AdDa, сделайте тоже макет. |
Часовой пояс GMT +3, время: 00:27. |