Вторник, 20.10.2020, 18:01
Главная  Форум Регистрация Блог RSS
Приветствую Вас, Гость
Меню сайта

Наш опрос
Вы посещаете сайт для ...


Всего ответов: 1464

установить такой вид опроса
Статистика
Яндекс.Метрика
Онлайн всего: 5
Гостей: 5
Пользователей: 0


Зарегистрировано 31001 (сегодня + 0 новых, вчера + 1 новых), В каталоге файлов 1130 материала(ов), Оставлено 5154 комментариев, На форуме создано тем и ответов.

установить такую статистику

Блок CW результаты

Победы
Победы(10)

Поражения
Поражения(5)


Установить CW блок на свой сайт
Внимание!
Наш сайт адаптирован под браузер Mozilla Firefox
скрипты для uCoz
Скачать/Download
В остальных браузерах наш сайт может отображаться некорректно! (IE,Opera,Google Chrome и т.д)

установить такой блок
Поиск



установить такую кнопку twitter
или такую
красивая кнопка Twitter

Расскажи Друзьям!
Топ комментаторов

установить такой информер
VKONTAKTE

FACEBOOK
Главная страница » Помощь Вебмастеру » Категория Скрипты для uCoz » Добавлено [25.10.2013, 21:13]

Скрипт часы 3D для uCoz

Войти или Зарегистрироваться [скачивать файлы могут только зарегистрированные пользователи!]

Подойдёт практически на любой сайт, ведь это очень красивое и нужное дополнение, которое понравиться любому посетителю, а в том случае если знать точное время ему не нужно будет, то красивый вид трёхмерных часов просто поднимет юзеру вашего сайта настроение и ничего плохого в этом не будет. Эти часы не совсем стандартные, они сделаны с 3D эффектом для большего впечатления. Установка делиться на два шага: скопировать код и вставить его на странице сверху между тегами <head>, второй же код нужно просто копирнуть в то место, где хотите видеть сами часы. Удачной установки. Задавайте вопросы в комментариях.

Установка скрипта 3D часов на uCoz:

Code
<script type="text/javascript" src="/js/jquery.ringclock.js"></script>

<style>
div#ringclock{margin:0;padding:0;overflow:hidden;position:relative;}
div#ringclock-mover{position:relative;}
div#ring-hour-container,div#ring-min-container,div#ring-sec-container{margin:0;padding:0;position:absolute;}
ul#ring-sec,ul#ring-min,p#ring-hour{position:relative;margin:0;padding:0;list-style-type:none;}
ul#ring-sec li,ul#ring-min li{position:absolute;}

div#ring-hour-container{top:0px;left:0;}
div#ring-min-container{ top:-20px;left:105px;}
div#ring-sec-container{top:8px;left:170px;}
div#ringclock{
width:100%;
height:500px;
background-color:#000;
border:solid 5px #306;
}

div#ringclock-mover{
width:100px;
height:50px;
}
ul#ring-sec{
color:#fff;
}
ul#ring-min{
color:#fff;
}
p#ring-hour{
color:#fff;
}
ul#ring-sec,
ul#ring-min{
font-size:20px;
}
p#ring-hour{
font-size:60px;
}

</style>

<script type="text/javascript">
$(function(){
$("div#ringclock").ringclock({
rsh:300,
rmw:300,
top:150,
left:0
});
});
</script>

Повторюсь, что для того, чтобы суметь адаптировать данные часы под свой сайт, необходимо хорошо разбираться в css

Следующий код в то место, где будут сами часы:

Code
<div id="ringclock">
<div id="ringclock-mover">
<div id="ring-hour-container">
<p id="ring-hour">hour</p>
</div>
<div id="ring-min-container">
<ul id="ring-min">
<li>00</li><li>01</li><li>02</li><li>03</li><li>04</li><li>05</li><li>06</li><li>07</li><li>08</li><li>09</li>
<li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li><li>17</li><li>18</li><li>19</li>
<li>20</li><li>21</li><li>22</li><li>23</li><li>24</li><li>25</li><li>26</li><li>27</li><li>28</li><li>29</li>
<li>30</li><li>31</li><li>32</li><li>33</li><li>34</li><li>35</li><li>36</li><li>37</li><li>38</li><li>39</li>
<li>40</li><li>41</li><li>42</li><li>43</li><li>44</li><li>45</li><li>46</li><li>47</li><li>48</li><li>49</li>
<li>50</li><li>51</li><li>52</li><li>53</li><li>54</li><li>55</li><li>56</li><li>57</li><li>58</li><li>59</li>
</ul>
</div>
<div id="ring-sec-container">
<ul id="ring-sec">
<li>00</li><li>01</li><li>02</li><li>03</li><li>04</li><li>05</li><li>06</li><li>07</li><li>08</li><li>09</li>
<li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li><li>17</li><li>18</li><li>19</li>
<li>20</li><li>21</li><li>22</li><li>23</li><li>24</li><li>25</li><li>26</li><li>27</li><li>28</li><li>29</li>
<li>30</li><li>31</li><li>32</li><li>33</li><li>34</li><li>35</li><li>36</li><li>37</li><li>38</li><li>39</li>
<li>40</li><li>41</li><li>42</li><li>43</li><li>44</li><li>45</li><li>46</li><li>47</li><li>48</li><li>49</li>
<li>50</li><li>51</li><li>52</li><li>53</li><li>54</li><li>55</li><li>56</li><li>57</li><li>58</li><li>59</li>
</ul>
</div>
</div>
</div>

Осталось лишь залить скрпт из прикреплённого архива в папку js


При копирование материалов с сайта необходимо указать активную ссылку источника - Скрипты для uCoz 2013 и Скрипт часы 3D для uCoz



Расскажи друзьям интересные новости:


- Установить на свой сайт блок социальных закладок
Категория: Скрипты для uCoz | Добавил: scripts_for_ucoz | Теги: 3d, часы
Просмотров: 4769 | Загрузок: 25 | Рейтинг: 1.0/1


Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Для добавления необходима авторизация

Хостинг от uCoz