Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.05.2011, 15:46
Интересующийся
Отправить личное сообщение для Luna82 Посмотреть профиль Найти все сообщения от Luna82
 
Регистрация: 20.05.2011
Сообщений: 11

slideToggle (поочередное открытие ссылок со скрытым текстом)
function MovingDiv(el) {
                 var elem=document.getElementById(el);
				 for (i=1;i<=4;i++){
				   if (i!=elem){
				      $('#'+i).slideUp("slow"); 
				     //document.getElementById(i).style.display='none'; 
				   }
				 }
                 $(elem).slideToggle("slow"); 
                 $(this).toggleClass("active");		
		}

<div><a href="#" onclick="MovingDiv('1'); ">Кликни сюда1</a></div>
<div id="1" style="display:none;">Текст скрытый1</div><br><br>

<div><a href="#" onclick="MovingDiv('2'); ">Кликни сюда2</a></div>
<div id="2" style="display:none;">Текст скрытый2</div><br><br>

<div><a href="#" onclick="MovingDiv('3'); ">Кликни сюда3</a></div>
<div id="3" style="display:none;">Текст скрытый3</div><br><br>

<div><a href="#" onclick="MovingDiv('4'); ">Кликни сюда4</a></div>
<div id="4" style="display:none;">Текст скрытый4</div>

хочу реализовать поочередное открытие ссылок. Но при повторном нажатии на ссылку (чтоб закрыть её) она закрывается и открывается заново. Я так понимаю это изза SlideUp... Подскажите как мне это правильнее реализовать.
P.s. JS только начинаю изучать...
Ответить с цитированием
  #2 (permalink)  
Старый 20.05.2011, 18:32
Новичок на форуме
Отправить личное сообщение для Konstantin.R.Dark Посмотреть профиль Найти все сообщения от Konstantin.R.Dark
 
Регистрация: 20.05.2011
Сообщений: 1

Непонятно алгоритм.

При нажатии на любую из ссылок должны открываться все ссылки по очередно? или только та на которую нажали?
Ответить с цитированием
  #3 (permalink)  
Старый 20.05.2011, 20:30
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

вариант1:
<script src="http://code.jquery.com/jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
    $('dl dt a').click(function(event) {
        $(event.target).parent('dt').next('dd').slideToggle(300);
        event.peventDefault();
    });
});
</script>
<dl>
    <dt><a href="#">click</a></dt>
    <dd>Текст скрытый1</dd>
    <dt><a href="#">click</a></dt>
    <dd>Текст скрытый2</dd>
    <dt><a href="#">click</a></dt>
    <dd>Текст скрытый3</dd>
<dl>
<style type="text/css">dd {display: none;}</style>

вариант2:
<script src="http://code.jquery.com/jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
    $('dl dt a').click(function(event) {
        $(event.target).parent('dt').next('dd').slideToggle(300).siblings('dd').hide();
        event.peventDefault();
    });
});
</script>
<dl>
    <dt><a href="#">click</a></dt>
    <dd>Текст скрытый1</dd>
    <dt><a href="#">click</a></dt>
    <dd>Текст скрытый2</dd>
    <dt><a href="#">click</a></dt>
    <dd>Текст скрытый3</dd>
<dl>
<style type="text/css">dd {display: none;}</style>
Ответить с цитированием
  #4 (permalink)  
Старый 21.05.2011, 18:30
Интересующийся
Отправить личное сообщение для Luna82 Посмотреть профиль Найти все сообщения от Luna82
 
Регистрация: 20.05.2011
Сообщений: 11

Сообщение от Konstantin.R.Dark Посмотреть сообщение
Непонятно алгоритм.

При нажатии на любую из ссылок должны открываться все ссылки по очередно? или только та на которую нажали?
при нажатии должна открываться ссылка, другая (если открыта) должна закрываться...наподобие аккордеона. но закрыть ссылку можно при повторном нажатии на ссылку и при нажатии на ссылку "закрыть" в тексте открывающегося скрытого текста
...
monolithed похоже 2 вариант самое то. Спасибо
Ответить с цитированием
  #5 (permalink)  
Старый 30.05.2011, 13:15
Интересующийся
Отправить личное сообщение для Luna82 Посмотреть профиль Найти все сообщения от Luna82
 
Регистрация: 20.05.2011
Сообщений: 11

А как теперь закрыть скрытый текст, щёлкнув по ссылке "Закрыть", которая расположена как раз в этом скрытом тексте.
Т.е. нужно реализовать 2 варианта закрытия скрытого текста...
Ответить с цитированием
  #6 (permalink)  
Старый 31.05.2011, 11:29
Интересующийся
Отправить личное сообщение для Luna82 Посмотреть профиль Найти все сообщения от Luna82
 
Регистрация: 20.05.2011
Сообщений: 11

с закрытием скрытого текста разобралась.
Почему так не работает :
<html>
<head>
<title>Главная страница сайта</title>
<head>
<script src="http://code.jquery.com/jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
    $('table tr td a.slide').click(function(event) {
          $(event.target).parent('td').next('div').slideToggle(500).siblings('div').hide();
    });
});
</script>
</head>
<body>
<table>
     <tr>
      <td>
        <a href="#"><!--какая то ссылка-->
         <img  src="pic.jpg" >
        </a>
      </td>
      <td>
       <!--нажатием на эту ссылку должен открываться и закрываться скрытый текст-->
       <a  class="slide" href="#" title="Подробнее..." > Показать скрытый текст
       </a>
      </td>
     </tr>
</table>

<div style="display:none;;">
<p>
 Скрытый текст
</p>

<div class="columns">
   <div class="column1">
       <a href="#"><!--какая то ссылка-->
         Фотографии
       </a>
   </div>
   <div class="column2" align="right">
     <a href="#">Свернуть</a><!--нажатием на эту ссылку должен закрываться скрытый текст-->
   </div>
</div>   
</div>
</body>
</html>

Последний раз редактировалось Luna82, 31.05.2011 в 11:37.
Ответить с цитированием
  #7 (permalink)  
Старый 05.06.2011, 11:50
Интересующийся
Отправить личное сообщение для Luna82 Посмотреть профиль Найти все сообщения от Luna82
 
Регистрация: 20.05.2011
Сообщений: 11

ну подскажите же
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
FancyBox, открытие двух ссылок dots_rei Общие вопросы Javascript 2 08.08.2009 00:47