вопрос
Сделал на свой сайт слайдер как показо здесь . http://heavenweb.ru/delaem-prostoy-slayder-na-jquery
Все поставил по инструкции , но на страниице показывает вот что.
из tpl
Все поставил по инструкции , но на страниице показывает вот что.
из tpl
{poll}
<script src="/NivoSlider/jquery.nivo.slider.pack.js" type= "text/javascript"></script>
<div class="base">
<div class="topinfopr"><div class="topinfo qualityon">
<span class="argquality"><b>{category}</b></span>
<span class="argviews"><span>Просмотров: {views}</span></span>
<span class="argback"><a href="javascript:history.go(-1)" title="Назад"><span><span>Вернуться назад</span></span></a></span>
</div></div>
<div class="bheading"><h1 id="news-title">{title}</h1></div>
<div class="infostore">
<span class="argdate">{date}</span>
<span class="argcat">{link-category} [complaint]Нашли ошибку?[/complaint]</span>
[rating]<div class="ratein">{rating}</div>[/rating]
</div>
<div class="binner">
<style>
#slider-wrap{ /* Оболочка слайдера и кнопок */
width:660px;
}
#slider{ /* Оболочка слайдера */
width:640px;
height:360px;
overflow: hidden;
border:#eee solid 10px;
position:relative;}
.slide{ /* Слайд */
width:100%;
height:100%;
}
.sli-links{ /* Кнопки смены слайдов */
margin-top:10px;
text-align:center;}
.sli-links .control-slide{
margin:2px;
display:inline-block;
width:16px;
height:16px;
overflow:hidden;
text-indent:-9999px;
background:url(radioBg.png) center bottom no-repeat;}
.sli-links .control-slide:hover{
cursor:pointer;
background-position:center center;}
.sli-links .control-slide.active{
background-position:center top;}
#prewbutton, #nextbutton{ /* Ссылка "Следующий" и "Педыдущий" */
display:block;
width:15px;
height:100%;
position:absolute;
top:0;
overflow:hidden;
text-indent:-999px;
background:url(arrowBg.png) left center no-repeat;
opacity:0.8;
z-index:3;
outline:none !important;}
#prewbutton{left:10px;}
#nextbutton{
right:10px;
background:url(arrowBg.png) right center no-repeat;}
#prewbutton:hover, #nextbutton:hover{
opacity:1;}
</style>
<script>
/*
HW Slider - простой слайдер на jQuery.
Настройки скрипта:
hwSlideSpeed - Скорость анимации перехода слайда.
hwTimeOut - время до автоматического перелистывания слайдов.
hwNeedLinks - включает или отключает показ ссылок "следующий - предыдущий". Значения true или false
Подробнее на http://heavenweb.ru/
*/
(function ($) {
var hwSlideSpeed = 700;
var hwTimeOut = 3000;
var hwNeedLinks = true;
$(document).ready(function(e) {
$('.slide').css(
{"position" : "absolute",
"top":'0', "left": '0'}).hide().eq(0).show();
var slideNum = 0;
var slideTime;
slideCount = $("#slider .slide").size();
var animSlide = function(arrow){
clearTimeout(slideTime);
$('.slide').eq(slideNum).fadeOut(hwSlideSpeed);
if(arrow == "next"){
if(slideNum == (slideCount-1)){slideNum=0;}
else{slideNum++}
}
else if(arrow == "prew")
{
if(slideNum == 0){slideNum=slideCount-1;}
else{slideNum-=1}
}
else{
slideNum = arrow;
}
$('.slide').eq(slideNum).fadeIn(hwSlideSpeed, rotator);
$(".control-slide.active").removeClass("active");
$('.control-slide').eq(slideNum).addClass('active');
}
if(hwNeedLinks){
var $linkArrow = $('<a id="prewbutton" href="#"><</a><a id="nextbutton" href="#">></a>')
.prependTo('#slider');
$('#nextbutton').click(function(){
animSlide("next");
return false;
})
$('#prewbutton').click(function(){
animSlide("prew");
return false;
})
}
var $adderSpan = '';
$('.slide').each(function(index) {
$adderSpan += '<span class = "control-slide">' + index + '</span>';
});
$('<div class ="sli-links">' + $adderSpan +'</div>').appendTo('#slider-wrap');
$(".control-slide:first").addClass("active");
$('.control-slide').click(function(){
var goToNum = parseFloat($(this).text());
animSlide(goToNum);
});
var pause = false;
var rotator = function(){
if(!pause){slideTime = setTimeout(function(){animSlide('next')}, hwTimeOut);}
}
$('#slider-wrap').hover(
function(){clearTimeout(slideTime); pause = true;},
function(){pause = false; rotator();
});
rotator();
});
})(jQuery);
</script>
<div id="slider-wrap">
<div id="slider">
<div class="slide"><img src="img/001.jpg" width="640" height="360"></div>
<div class="slide"><img src="img/002.jpg" width="640" height="360"></div>
<div class="slide"><img src="img/003.jpg" width="640" height="360"></div>
<div class="slide"><img src="img/004.jpg" width="640" height="360"></div>
</div>
</div>
{full-story}
<div class="clr"></div>
</div>
</div>
<div class="btags">
<div class="dtitle"><span><b>Теги:</b></span></div>
<div class="dcont">{tags}</div>
</div>
<div class="morelink">
<noindex><span class="argmore"> </span></noindex>
<div class="isicons">
<span></span>
<span>{favorites}</span>
</div>
<span class="argauthor">Опубликовал: {author} | Комментариев: {comments-num}</span>
</div>
<div class="hsep"> </div>
</div>
<div class="btags brelated">
[related-news]
<div class="dtitle"><span><b>Рекоммендуем также:</b></span></div>
<div class="dcont">
<ul class="reset">{related-news}</ul>
[/related-news]
</div>
</div>