Перейти к содержимому


Пользователь месяца
ShowPrint ShowPrint 1-й за Сентябрь
Очков активности: 283 2 темы, 21 сообщение, 7 баллов репутации
Сайт: ShowPrint.ru
ТОП самых активных за этот месяц
  • Фотография Medvedoc
    #1

    Medvedoc
    Очков активности: 426 8 тем, 47 сообщений, 4 балла репутации

  • Фотография ShowPrint
    #2

    ShowPrint (ShowPrint.ru)
    Очков активности: 120 Вне конкурса за определение пользователя месяца

  • Фотография BLIK
    #3

    BLIK
    Очков активности: 96 Вне конкурса за определение пользователя месяца

  • Фотография WGN
    #4

    WGN (worldgamenews.com)
    Очков активности: 73.5 Вне конкурса за определение пользователя месяца

  • Фотография Алексей111
    #5

    Алексей111 (xvideo24.ru)
    Очков активности: 61.5 8 тем, 17 сообщений, 1 балл репутации

  • Фотография Ixman
    #6

    Ixman (o5cat.ru)
    Очков активности: 54 0 тем, 12 сообщений, 3 балла репутации

  • Фотография yuran
    #7

    yuran (yurbol.ru)
    Очков активности: 30 1 тема, 17 сообщений, 1 балл репутации

  • Фотография Zevss
    #8

    Zevss (domles43.ru)
    Очков активности: 15 1 тема, 7 сообщений, 1 балл репутации

  • Фотография devpro
    #9

    devpro
    Очков активности: 13.5 0 тем, 9 сообщений, 1 балл репутации

  • Фотография MashaJans
    #10

    MashaJans
    Очков активности: 13.5 1 тема, 6 сообщений, 1 балл репутации

  • Показать весь ТОП 10

Kwork.ru - услуги фрилансеров от 500 руб.

Поддержите форум! =)
Апдейты
  • Яндекс тИЦ: 26.09.2018
  • Яндекс выдача: 16.10.2018
Топ 5 участников по репутации


Ссылки в слайдере

#1 IlyaKravchenko

IlyaKravchenko
  • Неактивные
  • 28 сообщений
  • Репутация: 1
0

Отправлено 02 August 2014 - 14:07

Привет всем. Установил на свой сайт на cms dle 10.1 одно слайд-шоу без java. 
Вот это стоит в slider.tpl
<div class="slides">
<ul> <!-- Слайды -->
<li><img src="{THEME}/images/slider/1.jpg" alt="image01" />
<div>Описание #1</div>
</li>
<li><img src="{THEME}/images/slider/2.jpg" alt="image02" />
<div>Описание #2</div>
</li>
<li><img src="{THEME}/images/slider/3.jpg" alt="image03" />
<div>Описание #3</div>
</li>
<li><img src="{THEME}/images/slider/2.jpg" alt="image03" />
<div>Описание #4</div>
</li>
</ul>
</div>
Это в стилях шаблона:
/* Slider */
.slides {
height:300px;
margin-bottom: 10px;
overflow:hidden;
position:relative;
width: 1000px;
}
.slides ul {
list-style:none;
position:relative;
}
/* Кадры анимации #anim_slides */
@-webkit-keyframes anim_slides {
0% {
opacity:0;
}
6% {
opacity:1;
}
24% {
opacity:1;
}
30% {
opacity:0;
}
100% {
opacity:0;
}
}
@-moz-keyframes anim_slides {
0% {
opacity:0;
}
6% {
opacity:1;
}
24% {
opacity:1;
}
30% {
opacity:0;
}
100% {
opacity:0;
}
}
.slides ul li {
opacity:0;
position:absolute;
top:0;
/* анимация css3 */
-webkit-animation-name: anim_slides;
-webkit-animation-duration: 24.0s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: normal;
-webkit-animation-delay: 0;
-webkit-animation-play-state: running;
-webkit-animation-fill-mode: forwards;
-moz-animation-name: anim_slides;
-moz-animation-duration: 24.0s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
-moz-animation-direction: normal;
-moz-animation-delay: 0;
-moz-animation-play-state: running;
-moz-animation-fill-mode: forwards;
}
/* Задержки css3 */
.slides ul li:nth-child(2), .slides ul li:nth-child(2) div {
-webkit-animation-delay: 6.0s;
-moz-animation-delay: 6.0s;
}
.slides ul li:nth-child(3), .slides ul li:nth-child(3) div {
-webkit-animation-delay: 12.0s;
-moz-animation-delay: 12.0s;
}
.slides ul li:nth-child(4), .slides ul li:nth-child(4) div {
-webkit-animation-delay: 18.0s;
-moz-animation-delay: 18.0s;
}
.slides ul li img {
display:block;
}
/* Кадры анимации #anim_titles */
@-webkit-keyframes anim_titles {
0% {
left:100%;
opacity:0;
}
5% {
left:10%;
opacity:1;
}
20% {
left:10%;
opacity:1;
}
25% {
left:100%;
opacity:0;
}
100% {
left:100%;
opacity:0;
}
}
@-moz-keyframes anim_titles {
0% {
left:100%;
opacity:0;
}
5% {
left:10%;
opacity:1;
}
20% {
left:10%;
opacity:1;
}
25% {
left:100%;
opacity:0;
}
100% {
left:100%;
opacity:0;
}
}
.slides ul li div {
background-color: rgba(252, 8, 8, 0.48);
color:#FFFFFF;
font-size:26px;
margin:0 auto;
padding:20px;
position:absolute;
top: 200px;
width: 350px;
/* Анимация css3 */
-webkit-animation-name: anim_titles;
-webkit-animation-duration: 24.0s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: normal;
-webkit-animation-delay: 0;
-webkit-animation-play-state: running;
-webkit-animation-fill-mode: forwards;
-moz-animation-name: anim_titles;
-moz-animation-duration: 24.0s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
-moz-animation-direction: normal;
-moz-animation-delay: 0;
-moz-animation-play-state: running;
-moz-animation-fill-mode: forwards;
}
Это на главной: {include file="slider.tpl"}

В результате все работает, но нет возможности вставить ссылку в текст на слайдах.
a4af4b1844c6db414711568da8401e94.png
Т.е. это просто идет как описание, а я хочу сделать как ссылку. Кто может помочь?
 
 
 

P.S. пытался прописать через тег <a href="site.ru">текст</a>, не работает. Текст становится черным и не работает как ссылка.


 

 

  • 0

#2 WPGet

WPGet
  • Неактивные
  • 276 сообщений
  • Репутация: 46

Отправлено 02 August 2014 - 14:48

Попробуйте так:

<div><a href="http://test.com">Описание #1</a></div>

а потом в CSS задайте стиль для тега a

Напишите адрес сайта с установленным слайдером.


  • 0

#3 IlyaKravchenko

IlyaKravchenko
    Topic Starter
  • Неактивные
  • 28 сообщений
  • Репутация: 1

Отправлено 02 August 2014 - 22:23

Не работает.


  • 0

#4 IlyaKravchenko

IlyaKravchenko
    Topic Starter
  • Неактивные
  • 28 сообщений
  • Репутация: 1

Отправлено 03 August 2014 - 12:58

Есть еще идеи?


  • 0



Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru