Подмена Css при скролле страницы сайта...


Подмена Css при скролле страницы сайта...

6616
8.6 из 10
Проголосовало: 12






Делаем подмену CSS кода при определенном скролле страницы сайта...

Установка:
1. Создаем 2 СSS файла с названием style1 и style2.
2. Меняем CSS в место родного на style1 и все.
3. Для изменения данных на странице при скролле переписываем нужные нам теги в style2.

Куда угодно:

Code
<script type="text/javascript">  
  var active = true;  
  var maxHeight = 500; // через сколько пикселей в низ подменять файл ксс  
  var linkCss = 'style'; //путь к файлу ксс без указания номера и расширения  
  window.addEventListener('scroll', function () {  
  var y = window.event ? document.body.scrollTop : document.html.scrollTop;  
  var c = String(linkCss + parseInt((y < maxHeight) ? '1' : '2') + '.css');  
  var l = document.head.getElementsByTagName('link');  
  if (active == true && l[l.length-1].href != c) {  
  l[l.length-1].parentNode.removeChild(l[l.length-1]);  
  active = false;  
  var css = document.createElement('link');  
  css.setAttribute('type', 'text/css');  
  css.setAttribute('rel', 'styleSheet');  
  css.setAttribute('href', c);  
  document.head.appendChild(css);  
  } else active = true;  
  }, false);  
  </script>


CSS 1

Code
BODY {background: #FFFFFF}  
  A:link {color: #80FF00}  
  A:visited {color: #FF00FF}  
  H1 {font-size: 24pt; font-family: arial}  
  H2 {font-size: 18pt; font-family: arial}  
  H3 {font-size: 14pt; font-family: arial}  
  img { width:350px; }


CSS 2

Code
BODY {background: #FFFFFF}  
  A:link {color: #80FF00}  
  A:visited {color: #FF00FF}  
  H1 {font-size: 24pt; font-family: arial}  
  H2 {font-size: 18pt; font-family: arial}  
  H3 {font-size: 14pt; font-family: arial}  
  img { width:500px; }


Автор: UberCHEL
Автор публикации: Загрузка
Загрузка
BLAzER, это его n материал
  • Всего комментариев: 8

CbIPoK2513
0
CbIPoK2513 написал: Написано 09 Октября 2015 в 19:25
Комментарий №8
Так, на Мозиле это дело не работает.
Ищите альтернативу smile

S@Nek
-1
S@Nek написал: Написано 19 Декабря 2012 в 18:55
Комментарий №7
демо классное biggrin

S@NekОтвет от Администрации:

Потише со словами.


{WarhameR}_KENT
0
{WarhameR}_KENT написал: Написано 19 Декабря 2012 в 18:41
Комментарий №6
Скрипт как в вк, если кто сделает свою соц. сеть то вот ему скриптег )
Это я так понимаю

Supermenыч
0
Supermenыч написал: Написано 19 Декабря 2012 в 16:49
Комментарий №4
для меню например, сначала оно не прозрачное, а как вниз страницы пошёл, то становится полупрозрачным

94tolyan163
0
94tolyan163 написал: Написано 19 Декабря 2012 в 16:12
Комментарий №3
такой же вопрос для чего скрипт этот?)

94tolyan163
0
94tolyan163 написал: Написано 19 Декабря 2012 в 16:03
Комментарий №2
Чето я не понил для чего ?)

FalleN
0
FalleN написал: Написано 19 Декабря 2012 в 16:02
Комментарий №1
труд все заслужен, но зачем такой скрипт?

Вовчик
0
Вовчик написал: Написано 19 Декабря 2012 в 17:02
Комментарий №5
что бы все ходили и спрашивали: "а для чего этот скрипт"
biggrin biggrin

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 24
Скрипты и модификации для Ucoz 2101
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 429
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
как поставить свою ссылку и логотип
  • Сатурн-1 написал:
  • Похвально.
  • Winston888 написал:
  • Я не говорил что делаю только скрипты. Я делаю шаблоны, скрипты, адаптации с разных движков под ucoz и на оборот + я ещё и сам рисую. В данный момент занимаюсь дизайном для webo4ka сам рисую сам верстаю.
  • Сатурн-1 написал:
  • Заметь, мы делаем почти одну и ту же работу.
    Ты - скрипты, я -шаблон. И каждый делает это бесплатно, НО
    ты делаешь скрипты без шаблона, я делаю шаблон без скриптов (не считая основных).
    Я тоже могу сказать что твои скрипты не идеальны, но не буду т.к. даже не знаю какие из всех существующих твои.
    Поэтому ты не сравнивай скрипты и шаблоны да еще и на Ucoz'e, мы же не на хакатоне каком нибудь.
  • Winston888 написал:
  • Если бы я не добавлял бесплатные адаптации или скрипты бесплатно я бы наверное не стал бы комментировать ваш материал.
    Последние темы
    Опрос
    403
    А
    Р
    Оцените новый дизай:)
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 2
    Гостей: 2
    Пользователей: 0
    0
    Сегодня были
    Топ пользователей: