Показать сообщение отдельно
  #1 (permalink)  
Старый 12.08.2008, 16:02
Интересующийся
Отправить личное сообщение для M.C. Посмотреть профиль Найти все сообщения от M.C.
 
Регистрация: 12.08.2008
Сообщений: 10

простой show/hide для контента
Всем привет!
Вот тут у Гугла сделано так - есть ссылки и есть скрытый конетнт под ними, при нажатии на ссылку этот контент открывается, при нажатии на ссылку ниже верхний скрывается, а нижний открывается и так далее...

Хотелось бы сделать что-то подобное, посмотрел скрипт Гугла - там вроде все просто, но хотелось бы еще проще, так как мне не нужно лишнего.

Вот код гугла

function initTrainingVids() {
  var vidLinks = [];
  var allLinks = document.getElementsByTagName('a');
  
  for(var i = 0, tag; tag = allLinks[i]; i++) {
    if(tag.className == 'vid') {
      vidLinks[vidLinks.length] = tag;
    }
  }

  for(var i = 0, vid; vid = vidLinks[i]; i++) {
    // Get YouTube video ID
    var vidId = vid.href.slice(vid.href.indexOf('=')+1);
    // Find object to add video to
    var vidTarget = vid.parentNode.parentNode.getElementsByTagName('div');
    vidTarget = vidTarget[vidTarget.length - 1];
    /**
    while(vidTarget.nodeName.toLowerCase() != 'div' && vidTarget.className != 'vid') {
      vidTarget = vidTarget.nextSibling;
    }
      **/
    // Attach onclick event
    vid.onclick = function(target, src) {
                    return function() {
                      if(target.style.display != 'block') {
                        var vidTag = '<iframe src="http://www.youtube.com/v/'+src+'"></iframe>';
                        target.innerHTML = vidTag;
                        var allDivs = document.getElementsByTagName('div')
                        for(var i = 0, div; div = allDivs[i]; i++) {
                          if(div.className == 'vid' && div.style.display == 'block') {
                            div.style.display = 'none';
                          }
                        }
                        target.style.display = 'block';
                      } else {
                        target.innerHTML = '';
                        target.style.display = 'none';
                      }
                      return false;
                    };
                  }(vidTarget, vidId);
  }

}


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

мне нужно просто что-то типа этого:

<a href="#" onclick="show (div1)">LINK1</a>
<div id=div1>
СОДЕРЖАНИЕ1
<div>

<a href="#" onclick="show (div2)">LINK2</a>
<div id=div2>
СОДЕРЖАНИЕ2
<div>

<a href="#" onclick="show (div3)">LINK3</a>
<div id=div3>
СОДЕРЖАНИЕ3
<div>


при этом, когда жму на ЛИНК1 то открывается СОДЕРЖАНИЕ1, когда жму на ЛИНК2 открывается СОДЕРЖАНИЕ2, а СОДЕРЖАНИЕ1 закрывается и т.д.

Нашел также скрипты, которые просто открывают/закрывают свой слой, но чтобы открывали свой, а закрывали чужие - не нашел....

Заранее спасибо!
Ответить с цитированием