[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Сворачивание блоков с сохранением в cookies
Дата: Суббота, 19.03.2011, 14:08 | Сообщение # 1
Администратор
    Сообщений:
    841
    Награды:
    2
Данный скрипт реализует сворачивание блоков с сохранением в cookies (примерно как на МС).

Установка:

Ставим в конец BODY этот код:

Code
<script type='text/javascript'>   
function Switchable(classname) {   
function getElementsByClassName(imgclass) {   
    if ( document.getElementsByClassName ) {   
     return document.getElementsByClassName(imgclass);   
    } else {   
     var nodes = document.getElementsByTagName('*'),   
     tmp = [];   
     for ( var i = 0; i < nodes.length; i++ ) {   
      if ( new RegExp('\\b' + imgclass + '\\b').test(nodes[i].className) ) {   
       tmp.push(nodes[i]);   
      }   
     }   
     return tmp;   
    }   
}   

function Next(element) {   
    var next = element;   
    while (next = next.nextSibling)   
     if ("innerHTML" in next)   
      return next;   
    return element;   
}   

function getCookie(a){var b=document.cookie.match(new RegExp("(?:^|; )"+a.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g,"\\$1")+"=([^;]*)"));return b?decodeURIComponent(b[1]):undefined}function setCookie(b,f,c){c=c||{};var i=c.expires;if(typeof i=="number"&&i){var h=new Date();h.setTime(h.getTime()+i*1000);i=c.expires=h}if(i&&i.toUTCString){c.expires=i.toUTCString()}f=encodeURIComponent(f);var a=b+"="+f;for(var e in c){a+="; "+e;var g=c[e];if(g!==true){a+="="+g}}document.cookie=a}   
    var nodes = getElementsByClassName(classname);   
    for (var i = 0; i < nodes.length; i++) {   
     var toggler = document.createElement("A");   
     toggler.href = "javascript://";   
     toggler.id = "toggler" + i;   
     toggler.innerHTML = getCookie("toggler" + i) == "hide" ? "+" : "-";   
     toggler.onclick = function () {   
      Next(this.parentNode).style.display = getCookie(this.id) == "hide" ? "" : "none";   
      setCookie(this.id, getCookie(this.id) == "hide" ? "show" : "hide", {   
       expires: new Date("01 Jan 2020")   
      });   
      this.innerHTML = getCookie(this.id) == "hide" ? "+" : "-";   
     };   
     Next(nodes[i]).style.display = getCookie("toggler" + i) == "hide" ? "none" : "";   
     nodes[i].appendChild(toggler);   
    }   
}   

Switchable("header");   
</script>

Внизу расположен вызов Switchable("header"); — так вот, header — это класс элемента, содержащий заголовок блока. Проще говоря, все блоки, к которым нужно применить этот скрипт, должны иметь такую структуру:
Code
<div class='header'>   
Заголовок   
</div>   
<div>   
Содержимое   
</div>

Т.е. сначала идёт элемент с заголовком, а сразу за ним — элемент с содержимым.

  • Страница 1 из 1
  • 1
Поиск: