Скрипт до нового 2012 года осталось


Скрипт до нового 2012 года осталось

3595
6.8 из 10
Проголосовало: 5






Счётчик показывает сколько осталось до нового года, используя лишь пару изображений, всеми любимый html-css и небольшой файл js весом в 2 кб.

В интернете очень много решений, но многие из них устарели визуально или созданы благодаря технологии Flash, которая предоставляет как говориться тысяча и один эффект создать нужный нам счётчик.

Но давайте обойдёмся без лишней мишуры и установим к себе на сайт простой, но заметный счётчик сколько осталось до нового года.

Установка:


1) Для начало в исходный код вашей страницы установим JS, который будет отвечать за отсчёт времени:

Code
<script type="text/javascript" src="http://webo4ka.ru/Ucoz5/newYearckript_do_novogo_2012goda_ostaloci.js"></script>


2) Теперь, чтобы наш с вами счётчик появился на вашей страницы сайта, следует разместить в нужном месте следующий html код:

Code
<div id="logo_prazdnik"><p id="center_dm_ru_newyear"></p></div>


3) Наш с вами счётчик почти готов, осталось лишь прописать ему нужные стили:

Code
/* До нового года осталось  
  ------------------------------------------*/  
  #logo_prazdnik {  
  float:left;  
  width:200px;  
  height:100px;  
  background:url(http://webo4ka.ru/Ucoz5/prazdnik_do_novogo_2012goda_ostaloci.jpg) no-repeat;  
  border:1px solid #fff  
  }  

  #prazdnik_title,  
  #prazdnik_title2{  
  float:left;  
  text-align:center;  
  font: 115%/1.2 Verdana,Arial,Helvetica, sans-serif;  
  color:#d3d3d3; text-shadow: 1px 1px 1px #111;  
  padding: 5px;  
  background:url(http://webo4ka.ru/Ucoz5/pix_title__do_novogo_2012goda_ostaloc.png) top;  
  border: 1px solid #222;  
  }  

  #prazdnik_title{  
  margin: 10px 20px 10px 20px;  
  }  

  #prazdnik_title2{  
  margin: 20px 20px 10px 20px;  
  }  

  #prazdnik_title span{  
  float:left;  
  padding-bottom: 5px;  
  }


как вы понимаете из выше предоставленного кода, за основу мы взяли <div> ячейку, в которую поместили тег <p> и прописали для них нужные атрибуты в css стилях, по сути дела мы задействовали два изображения, основной фон главной ячейки div и полупрозрачный фон тега p, в котором и отображается наш с вами счётчик.

p.s. Теперь вам осталось найти в интернете нужное изображение которое подходит к тематики нового года, додумать его в Фотошопе, залить к себе на сайт и прописать в css стилях.

Но если вы не хотите тратить своё время или у вас отсутствует желания или знания обработать изображение в Фотошопе, ниже я предост

Автор публикации: Загрузка
Загрузка
Вовчик, это его n материал
Источник: http://www.center-dm.ru/
  • Оставить первым комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 25
Скрипты и модификации для Ucoz 2113
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 431
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
  • sasha2016tv написал:
  • Хороший скрипт
    Ох. Вижу, что обсуждение очень старое. Но!
    На других CMS так же будет все это реализовано. На нормальных CMS.
    Такое решение может подойти лишь для landing сайтов. Но и то, не думаю, что там кто то заморачивается в написании какого либо контроллера генерирования шаблона и используют прямо в лоб чистый HTML, поэтому и будут для каждой страницы свои блоки делать.

    Поэтому лучше тут все же дописать решение именно для ucoz без загрузки этих лишних блоков на странице. Ведь используя условные операторы этот код даже не будет прогружаться на странице. (Лол. Это ж доли секунд загрузки...) И что? Но давайте делать оптимальнее
    Моё авторство:)
  • 1488 написал:
  • 1488 написал:
  • Смысл исходный код? он возвращает после обновление страницы на то положение которое было... или как?
  • 1488 написал:
  • как поставить галки как скрине?
    а то невозможно поставить...
    Последние темы
    Опрос
    433
    А
    Р
    Оцените новый дизай:)
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    0
    Сегодня были
    Топ пользователей: