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

Реферальная программа Мегаплана

Партнерская программа Kredov

Помогите с заменой шапки на слейдер

#11 Алия

Алия
  • Пользователь
  • 42 сообщений
  • Репутация: 10
0

Отправлено 23 Август 2012 - 03:51

surfer, спасибо за подсказку +1. Пока освоила только html и css, остальное методом тыка.


Артур22, по-моему, это довольно простой скрипт. Мне не совсем понятно, куда именно Вы собираетесь ставить слайдер на Вашем сайте, у Вас в хедере много чего размещено, если слайдер криво встает, возможно, вы его вкладываете не в тот див. Проверьте сначала, работает ли он в принципе, вставив, его, например, на место banner468х60.
  • 0

#12 Алия

Алия
  • Пользователь
  • 42 сообщений
  • Репутация: 10

Отправлено 23 Август 2012 - 15:43

Артур22,
Почитав про слайдеры и DLE, обнаружила, что возможны проблемы с внешними библиотеками jquery.
Вот ссылка на очень простой чисто js слайдер, надеюсь, подойдёт: http://www.yellowlem...er/tinyslider-2
Кстати, есть шаблон для DLE со слайдером: http://dle-joomla.ru...-slayderom.html
  • 0

#13 Rune

Rune
  • Пользователь
  • 22 сообщений
  • Репутация: 0

Отправлено 23 Сентябрь 2012 - 23:28

Шаблон, честно говоря так себе, при этом очень криво встает. Может быть у меня какие-то проблемы возникли, не исключаю, но изначально шаблон этого слейдера вызывал у меня противоречивые ощущения. После установки все мои негативные догадки подтвердились. Не рекомендую его использовать.
  • 0

#14 TihonoffAntony

TihonoffAntony
  • Пользователь
  • 23 сообщений
  • Репутация: 1

Отправлено 24 Сентябрь 2012 - 18:04

Сделал бы лучше анимированную шапку и не парился бы. Думаю она больше привлечет посетителей , чем слайды. Анимашки сейчас больше нравятся людям , чем слайды.
  • 0

#15 Flex

Flex
  • Пользователь
  • 24 сообщений
  • Репутация: 0

Отправлено 24 Сентябрь 2012 - 20:21

Я тоже считаю , что анмимированная шапка больше пользователей привлечёт. Слайды можно сказать уже устарели и всем надоели. Сейчас , так сказать , среди сайтов более популярны те , где есть анимации.
  • 0

#16 Vlad Sosnovskii

Vlad Sosnovskii
  • Заблокированные
  • 13 сообщений
  • Репутация: 0

Отправлено 17 Апрель 2013 - 13:50

Вот хороший слайдер меняем только картинки .

<style>
#content {
/* Ширина слайдера */
width:200px;
margin:0px;
}
.slider {
float:left;
/* Ширина слайдера */
width:200px;
/* Высота слайдера */
height:200px;
position:relative;
padding-bottom:26px;
background:url([url="http://delaisait.ucoz.ru/img/1/1/dsslider/bottom_shadow.png"]http://delaisait.uco...ttom_shadow.png[/url]) no-repeat bottom center;
}
.sliderContent {
float:left;
/* Ширина слайдера */
width:200px;
/* Высота слайдера */
height:200px;
clear:both;
position:relative;
overflow:hidden;
}
.sliderArrows a {
display:block;
text-indent:-9999px;
outline:none;
z-index:50;
background-image:url([url="http://delaisait.ucoz.ru/img/1/1/dsslider/prev_next.png"]http://delaisait.uco...r/prev_next.png[/url]);
width:42px;
height:42px;
position:absolute;
top:50%;
margin-top:-34px;
}
.prev {
background-position:0 0;
left:15px;
}
.prev:hover {
background-position:0 -44px;
}
.next {
right:15px;
background-position:-44px 0;
}
.next:hover {
background-position:-44px -44px;
}
.sliderContent .item img{
position:absolute;
/* Ширина слайдера */
width:200px;
/* Высота слайдера */
height:200px;
background:#000;
background-size:100% 100%;
-moz-background-size:100% 100%;
-webkit-background-size:100% 100%;
-o-background-size:100% 100%;
-ms-background-size:100% 100%;
}
.sliderBullets {
position:absolute;
bottom:0;
left:50%;
z-index:50;
margin-left:-45px;
}
.sliderBullets a {
display:block;
float:left;
text-indent:-9999px;
outline:none;
margin-left:5px;
width:10px;
height:11px;
background:url([url="http://delaisait.ucoz.ru/img/1/1/dsslider/bullets.png"]http://delaisait.uco...der/bullets.png[/url]) no-repeat;
}
.sliderBullets .active {
background-position:0 -11px;
}
.sliderContent a {
outline:none;
}
</style>
<div class="slider dsslider">
<div class="sliderContent">
<div class="item">
<img src="http://delaisait.ucoz.ru/img/1/1/dsslider/1.jpg" alt="" />
</div>
<div class="item">
<img src="http://delaisait.ucoz.ru/img/1/1/dsslider/2.jpg" alt="" />
</div>
<div class="item">
<img src="http://delaisait.ucoz.ru/img/1/1/dsslider/3.jpg" alt="" />
</div>
<div class="item">
<img src="http://delaisait.ucoz.ru/img/1/1/dsslider/4.jpg" alt="" />
</div>
<div class="item">
<img src="http://delaisait.ucoz.ru/img/1/1/dsslider/5.jpg" alt="" />
</div>
<div class="item">
<img src="http://delaisait.ucoz.ru/img/1/1/dsslider/6.jpg" alt="" />
</div>
</div>
</div>
<script src="http://delaisait.ucoz.ru/js/jQuery/mobilyslider.js" type="text/javascript">
</script>
<script type="text/javascript">
$('.dsslider').mobilyslider({
// Тип воспроизведения (vertical) или удалить всю строку
transition: 'fade',
// Скорость перелистывания
animationSpeed: 800,
// Автовоспроизведение включено
autoplay: true,
// Скорость автовоспроизведения
autoplaySpeed: 3000,
// Остановка во время наведения курсора (false)
pauseOnHover: true,
// Показывать кнопки вперёд назад (false)
bullets: true,
// Показывать нижние кнопки управления (false)
arrowsHide: true
});
</script>

результат можно посмотреть на этой странице http://www.m3i.ru/index/slajder/0-72

<script src="http://delaisait.ucoz.ru/script/js/1/2013/flux.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function(){
if(!flux.browser.supportsTransitions)
alert("Flux Slider requires a browser that supports CSS3 transitions");
window.f = new flux.slider('#dssliderbars', {
pagination: false,
controls: false, // Кнопки управления, можно (true)
transitions: ['bars'],
autoplay: true // Автозапуск, можно (false)
});
});
</script>
<div id="dssliderbars">
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img1.jpg" alt="" />
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img2.jpg" alt="" />
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img3.jpg" alt="" />
</div>

результат можно посмотреть на этой странице http://www.m3i.ru/index/slajder2/0-73 нужно только вставить код .

<script src="http://delaisait.ucoz.ru/script/js/1/2013/flux.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function(){
if(!flux.browser.supportsTransitions)
alert("Flux Slider requires a browser that supports CSS3 transitions");
window.f = new flux.slider('#dssliderwarp', {
pagination: false,
controls: false, // Кнопки управления, можно (true)
transitions: ['warp'],
autoplay: true // Автозапуск, можно (false)
});
});
</script>
<div id="dssliderwarp">
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img1.jpg" alt="" />
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img2.jpg" alt="" />
<img src="http://delaisait.ucoz.ru/script/img/1/2013/img3.jpg" alt="" />
</div>


результат можно посмотреть на этой странице http://www.m3i.ru/index/slajder3/0-74
  • 0


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