Скрипты и шаблоны для uCoz - 3aKa4Ka
Каталог файлов | Иконки групп | Видео уроки | Статьи | PSD исходники | SEO софт/программы | SEO новости
Скрипты для uCoz Шаблоны для uCoz
Меню сайта
Новое на форуме ↓
Новые комментарии
Кто на сайте
Онлайн всего: 2
Гостей: 2
Пользователей: 0

Сайт сегодня посетили:

Сворачивание/разворачивание области с сохранением в cookie

Главная » Скрипты для uCoz » Сворачивание/разворачивание области с сохранением в cookie
Сворачивание/разворачивание области с сохранением в cookie для uCoz
Наверное многие видели сворачивание блоков, например как вконтакте.ру с сохранением в cookie. Теперь подобное вы можете реализовать прямо у себя на сайте.

Перед </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>

Автор: $USERNAME$
Просмотров: 1157 | Комментариев: 0 | Опубликовал: DizeL | Дата: 17.01.2011

 17.01.2011   

 

 Черное, красивое вы... 

 05.11.2009   

 

 Репутация и награды... 

 17.01.2010   

 

 Фотохостинг для фор... 

 26.01.2011   

 

 Извещения об обновл... 

 08.11.2009   

 

 Все страницы модуля 


Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
© 3aka4ka.at.ua 2008 - 2024г. Все материалы размещенные на сайте принадлежат их владельцам и предоставляются исключительно в ознакомительных целях. Администрация ответственности за содержание материала не несет и убытки не возмещает.