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



Как запустить автоматическую карусель на css?

#1 Eugen4k

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

Отправлено 12 Февраль 2013 - 09:23

Дамы и господа! Очень нужен совет, подсказка, вобщем, любая помощь в следующем:

есть карусель, скрипт взят отсюда: http://coolcarousels.frebsite.nl/c/48/

В этой карусели картинки сменяются нажатием кнопки "вправо", "влево", но хочется, чтобы картинки менялись автоматически. C задержкой, например, 3 секунды.

Вот, карусель, которая сейчас установлена:
Изображение

вот код карусели:


<div class="thumbsContainer">
			<a id="prev" href="#" style="display: block;" class=""></a>
			<a id="next" href="#" style="display: block;" class=""></a>			
			<div class="thumbsCont">
			<div class="caroufredsel_wrapper" style="display: block; text-align: left; float: none; position: relative; top: auto; right: auto; bottom: auto; left: auto; z-index: auto; width: 451px; height: 109px; margin: 0px; overflow: hidden;">
<div id="thumbs" style="text-align: left; float: none; position: absolute; top: 0px; right: auto; bottom: auto; left: 36px; margin: 0px; width: 2351px; height: 109px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17921&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17912&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;" class="selected">
<img src="http://trp-parts.ru/getfile.php?id_file=17913&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17914&amp;id_reseller=157450" width="85" height="85" style="margin-right: 40px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17915&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17916&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17917&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17918&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17919&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
<img src="http://trp-parts.ru/getfile.php?id_file=17920&amp;id_reseller=157450" width="85" height="85" style="margin-right: 5px;">
																			  </div></div>		
															   </div>
											   </div>

Используемый css во вложении и продублирован сюда:
body {
overflow: auto;
overflow-x: auto;
overflow-y: scroll;
font-size: 70%;
background: url('/images/topbg.jpg') repeat-x center top;
min-width: 1240px;
width: 100%;
}
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
min-width: 1240px;
}
.wrapper {
position:relative;
min-height: 100%;
height: auto !important;
height: 100%;
margin-top: -155px;
background: url('/images/top-bg.jpg') no-repeat right 155px;
}
/* Tags  */
/* -------------------------------------------------------------------------- */
input, select, textarea, button, submit {
font-family: arial, sans-serif;
}
text, body, p, tr, td, td.search{
color: #000000;
font-weight: normal;
font:  9pt/14px 'arial';
}
img {
border: none;
outline: none;
}
hr{
height: 1px;
border: 0;
margin: 0 !important;
border-top: 1px solid #AAAAAA;
line-height: 1px;
}
a:link, a:visited{
color: #00529B;
text-decoration: underline;
font:  9pt/14px 'arial';
outline: none;
}
.linkDashed{
	cursor: help;
	border-bottom: 1px dashed;
}
/* Titles  */
/* -------------------------------------------------------------------------- */
h1,h2,h3,h4{
margin:0 0 10px 0;
}
h1{
color:#323232;
font: bold 15pt/22px 'arial';
}
h2{
color:#969696;
font: bold 12pt/22px 'arial';
}
.main_title{
color:#555 !important;
font: bold 12pt/18px 'arial' !important;
}
.breadcrumbs strong{
color:#555;
font: bold 12pt/18px 'arial';
}
.guest {
cursor: help;
border-bottom: 1px dashed #000;
color: red;
font-weight: bold;
font-size: 13px;
}
.nowrap {
white-space: nowrap;
}
.cursor-pointer {
cursor: pointer;
}
.fullwidth {
width:100%;
}
.cl {
float:none;
clear:both;
height:0;
line-height:0;
font-size:0;
padding:0;
margin:0;
}
.classicDiv {
border: 1px solid #999;
padding: 5px;
text-align: left;
vertical-align: top;
background-color: #EEE;
display:inline;
}
fieldset.classicDiv {
padding: 0px 5px 5px 5px;
}
fieldset.classicDiv legend {
color: #333;
}
.editable_block_border,
.parent-block {
position: relative;
clear: both;
}
.parent-block table{
border-spacing: 0;
}
/* Header */
/* -------------------------------------------------------------------------- */
.head {
height: 196px;
padding-top: 160px;
}
.head .logo{
margin:20px 0 0 20px;
float: left;
width: 210px;
display: inline-block;
height: 130px;
text-align: left;
}
.head .logo a{
color:#00529b;
font: normal 11pt/24px 'arial';
text-align: right;
text-decoration: underline;
}
.head .logo .code{
color:#4B4B4B;
font: normal 11pt/24px 'arial';
}
.head .logo .phone{
color:#00529b;
font: bold 14pt/24px 'arial';
}
.head .login{
display: inline-block;
float: right;
vertical-align: top;
padding-top: 10px;
height: 100px;
}
a.basketOrder{
color:#464646;
float: left;
font: normal 10pt/24px 'arial';
padding: 0 0 0 17px;
clear: both;
width: 200px;
}
.basketLegend-container{
display: inline-block;
padding: 11px 0 0 16px;
height: 90px;
width: 230px;
float: right;
vertical-align: top;
margin: 22px 0 0 0;
background: url('/images/baskettopbg.png') repeat center top;
}
.basketLegend-container img{
float: left;
padding: 7px 0 0 0;
}
.basketLegend-container a.basketTitle{
color:#00529b;
float: left;
font: normal 11pt/24px 'arial';
padding: 0 0 0 8px;
text-decoration: none;
}
.basketLegend-container .basketLegend{
vertical-align: top;
float: left;
width: 200px;
clear: both;
padding: 0 0 0 18px;
}
.basketLegend-container .basketLegend .title{
color:#464646;
font: normal 10pt/16px 'Arial';
white-space: nowrap;
}
.basketLegend-container .moneySumm{
color:#7AABC9;
font: bold 10pt/16px 'Arial';
padding: 0 0 0 5px;
}
.basketLegend-container .qty{
color:#7AABC9;
font: bold 10pt/16px 'Arial';
padding: 0 0 0 13px;
}
.qty_bask,
.moneySumm_bask{
color:#7AABC9;
font: bold 10pt/16px 'Arial';
}
.topLinks{
float: right;
clear: both;
}
.topLinks a,
.topLinks a:visited{
font:normal 10.5pt/41px 'Arial';
padding:0 5px 7px 5px;
color:#4B4B4B;
text-decoration: none;
}
.topLinks a.act{
border-bottom: 3px #EC1B2E solid;
}
.topLinks a:hover{
border-bottom: 3px #EC1B2E solid;
}
.bgLog{
background:url(/images/menubot.jpg) no-repeat center bottom  #F5F5F5;
padding:0 5px 0 27px;
width: 168px;
float: left;
clear: both;
}
.bgLogRad{
padding:0 5px 0 27px;
width: 168px;
-webkit-border-radius: 0 0 6px 0;
-moz-border-radius: 0 0 6px 0;
border-radius: 0 0 6px 0;
behavior: url(/PIE.htc);
background: #f5f5f5;
float: left;
clear: both;
}
/* The main part */
/* -------------------------------------------------------------------------- */
.content-div {
position: absolute;
top: 375px;
bottom: 5px;
width: 100%;
}
.content-tbl{
height: 100%;
width: 100%;
}
/* Menu (left) */
/* -------------------------------------------------------------------------- */
.sidebar {
padding: 0px 10px 0px 0;
vertical-align: top;
width: 200px;
}
.persManager{
padding: 0 0 30px 24px;
width: 176px;
min-height: 150px;
margin: 0 0 20px 0;
-webkit-border-radius: 0 0 6px 0;
-moz-border-radius: 0 0 6px 0;
border-radius: 0 0 6px 0;
behavior: url(/PIE.htc);
background: #f5f5f5;
float: left;
clear: both;
}
.persManager .title{
color: #00529B;
font: normal 11pt/13px 'arial';
}
.persManager .info{
color: #323232;
height: 64px;
font: normal 10pt/22px 'arial';
border-bottom:1px solid #C8C8C8;
padding: 10px 0 0 0;
width: 152px;
}
.persManager .infoHeight{
color: #323232;
font: normal 10pt/22px 'arial';
border-bottom:1px solid #C8C8C8;
padding: 10px 0 0 0;
width: 152px;
}
.persManager .info img{
float: left;
}
.managerPhoto {
width: 125px;
}
.persManager .info span{
float: left;
padding: 20px 0 0 0;
font: normal 10pt/16px 'arial';
}
.persManager .contacts{
clear: both;
padding: 5px 0 0 0;
}
.persManager .contacts,
.persManager a{
color: #656565;
font: normal 9.5pt/20px 'arial';
}
.messengersImg {
vertical-align: bottom;
}
/* Content (right) */
/* -------------------------------------------------------------------------- */
.content-main {
padding: 0 10px 10px 10px;
vertical-align: top;
text-align: left;
height: 100%;
}
/* Footer */
/* -------------------------------------------------------------------------- */
.foot {
position: relative;
height: 160px;
background: #EFEFEF;
}
.foot .footer{
height: 160px;
margin: 0;
}
.foot .site {
float: left;
width: 290px;
text-align: left;
height: 44px;
padding: 0 30px 0 15px;
}
.foot .site td {
color:#646464;
font:  8.5pt/14px 'arial';
}
.foot .site td a,
.foot .site td a:visited{
color:#646464;
text-decoration: none;
font:  8.5pt/14px 'arial';
}
.foot .banners {
float: right;
padding: 63px 10px 0 0;
width: 100px;
text-align: right;
height: 40px;
}
.foot .banners img{
padding-top: 5px;
}
table.mainPageTable{
border:0;
border-collapse: collapse;
width: 100%;
}
.foot .adress{
height: 160px;
float: left;
padding: 0 30px;
background: url('/images/foot-separator.jpg') no-repeat left center;
}
.foot .adressTitle{
color:#323232;
font: bold 9.5pt/20px 'arial';
}
.foot table td{
vertical-align: top;
}
.foot .payment div,
.foot .social div{
padding: 12px 0 0 0;
color:#323232;
font: normal 10pt/24px 'arial';
}
.foot .copy{
padding: 0 5px 0 0;
font:  bold 20pt/22px 'arial';
}
.foot .office{
color:#646464;
font:  10pt/14px 'arial';
}
.foot .coords{
color:#646464;
font: 8.5pt/14px 'arial';
}
.foot .social{
float: left;
height: 160px;
padding: 0 30px;
background: url('/images/foot-separator.jpg') no-repeat left center;
}
.foot .payment{
height: 160px;
padding: 0 30px;
float: left;
background: url('/images/foot-separator.jpg') no-repeat left center;
}
table.mainPageTable td{
vertical-align: top;
}
.mainNews{
width:280px;
vertical-align: top;
padding: 0 0 0 15px;
float: right;
}
.mainNews .title {
color:#4b4b4b;
font:  bold 12pt/21px 'arial';
padding: 0 0 0 5px;
}
.mainPageInfo{
vertical-align: top;
padding: 0 0 0 20px;
}
.mainPageInfo .title{
color:#4b4b4b;
font:  bold 11pt/22px 'arial';
}
/* clearFix ?*/
/* -------------------------------------------------------------------------- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clear {
float: none;
clear: both;
}
/* Hides from IE-mac ?\*/
/* -------------------------------------------------------------------------- */
* html .clearFix {
height: 1%;
}
.clearFix {
display: block;
}
.clearfix:after{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix{
display: inline-block;
}
/* End hide from IE-mac */
/* -------------------------------------------------------------------------- */
.paginator {
padding: 4px 0px 4px 0px;
}
.paginator a{
color: #4A86CE;
text-decoration: none;
font:  9pt/14px 'arial';
}
body > div.jGrowl.center{
width:50% !important;
height:50% !important;
top:25% !important;
left:25% !important;
}
/**** Vanadium styles ****/
/* -------------------------------------------------------------------------- */
.vanadium_alert {
background-color: #fff;
border-style: none !important;
}
.vanadium_alert span{
display: none;
color: red;
}
/**** Vanadium styles for FEEDBACK, VIN, REG, REMINDPASSWORD ****/
/* -------------------------------------------------------------------------------------------------------------------------- */
.feedback input[type=text].vanadium-invalid,
.feedback textarea.vanadium-invalid,
.vinquery input[type=text].vanadium-invalid,
.vinquery textarea.vanadium-invalid,
.registration input[type=text].vanadium-invalid,
.registration input[type=password].vanadium-invalid,
.registration select.vanadium-invalid,
.remindpass input[type=text].vanadium-invalid {
border-color: red !important;
border-style: solid !important;
border-width: 1px;
margin: 0px;
vertical-align: bottom;
}
.feedback input[type=text].vanadium-valid,
.feedback textarea.vanadium-valid,
.vinquery input[type=text].vanadium-valid,
.vinquery textarea.vanadium-valid,
.registration input[type=text].vanadium-valid,
.registration input[type=password].vanadium-valid,
.registration select.vanadium-valid,
.remindpass input[type=text].vanadium-valid {
border-color: green !important;
border-style: solid !important;
border-width: 1px;
margin: 0px;
vertical-align: bottom;
}
.feedback input[type=text],
.feedback textarea,
.feedback input[type=submit],
.vinquery input[type=text],
.vinquery textarea,
.vinquery select,
.vinquery input[type=submit],
.registration input[type=text],
.registration input[type=submit],
.registration input[type=password],
.registration textarea,
.registration select,
.remindpass input[type=text] {
font-family: Arial, sans-serif;
border-style: solid;
border-width: 1px;
border-color: #7B9EBD;
margin: 0px;
}
/* Deployment  */
/* -------------------------------------------------------------------------- */
.list-header h4 a {
color: #FFFFFF;
font-size: 12px;
font-weight: bold;
text-decoration: none;
vertical-align: top;
}
/* Dark screen search  */
/* -------------------------------------------------------------------------- */
.darkscreen{
background-color:#505050;
position:absolute;
opacity:0.4;
width:100%;
height:100%;
z-index:1;
display: none;
}
/* 404  */
/* -------------------------------------------------------------------------- */
#wrapper{
background: #fff !important;
height: 100%;
}
#header{
text-align: center;
width: 100%;
padding: 10px 0 10px 0;
}
#footer{
margin: 0 5px 0 5px;
border-top: 1px solid #000;
}
#footer .banners{
padding: 10px 10px 0 0;
float: right;
}
/* для корректного отображения информации в результатах поиска  */
/* -------------------------------------------------------------------------- */
.searchResultInfo{
background: #fff !important;
}
/* Чтобы ред блок не переносился на новую строку  */
/* -------------------------------------------------------------------------- */
.editable_block_border{
display: inline;
}

.MainCatalog{
width:100%;
}
.MainCatalog .title{
float: left;
color:#fff;
background:url(/images/searchtop.png) no-repeat center bottom;
width: 728px;
height: 28px;
font: bold 11pt/29px 'arial';
padding: 0 0 0 0;
}
.MainCatalog .catalogs{
width: 100%;
height: 120px;
display: table;
border-collapse: collapse;
border-spacing: 0;
padding: 0;
border-left: 1px solid #BBBBBB;
border-right: 1px solid #BBBBBB;
border-bottom: 1px solid #BBBBBB;
-webkit-border-radius: 0 0 8px 8px;
-moz-border-radius: 0 0 8px 8px;
border-radius: 0 0 8px 8px;
behavior: url(css/PIE.htc);
background:url(/images/catalogsbg.jpg) repeat-x center bottom;
}
.MainCatalog .man{
padding: 20px 45px;
text-align: center;
background:url(/images/catalogseparator.jpg) no-repeat right center;
}
.MainCatalog .man img{
padding: 10px 0 0 0;
}
.MainCatalog .trp{
text-align: center;
padding: 20px 45px;
background:url(/images/catalogseparator.jpg) no-repeat right center;
}
.MainCatalog .trp img{
padding: 10px 0 0 0;
}
.MainCatalog .daf{
text-align: center;
padding: 20px 45px;
}
.MainCatalog .daf img{
padding: 10px 0 0 0;
}
.MainCatalog .title span{
padding: 0 0 0 10px;
}
.pollBlock td{
color:#4B4B4B !important;
font: normal 9.5pt/18px 'arial';
}
.pollBlock td b{
color:#4B4B4B !important;
font: bold 10pt/22px 'arial';
}
.pollBlock input[type=submit]{
color:#00529C !important;
font: normal 9.5pt/18px 'arial';
float: right;
}
/*slideshow*/
.flexslider .info-in-header .box{
background:url(/images/slider.png) no-repeat bottom center;
font:normal 11pt/14px  'Trebuchet Ms', 'sans-serif';
color:#000;
text-align: center;
padding: 10px;
width: 86px;
border: 1px #000 solid;
height: 92px;
float: left;
text-shadow:1px 1px 0 #fff;
}
.flexslider .info-in-header .box h3{
margin: 5px 0 10px 0;
color:#000;
font: bold 15pt/18px  'Trebuchet Ms', 'sans-serif';
text-align: center;
text-shadow:1px 1px 0 #fff;
}
.flexslider .info-in-header {
line-height: 20px;
margin: 0 0 -150%;
position: absolute;
padding: 30px 30px 30px 62px;
text-align: left;
}
/* FlexSlider Necessary Styles
*********************************/
.flexslider .slides > li {
display: none;
-webkit-backface-visibility: hidden;
}
/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides  {
width: 100%;
display: block;
}
.flex-pauseplay span {
text-transform: capitalize;
}
/* Clearfix for the .slides element */
.slides:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
html[xmlns] .slides {
display: block;
}
* html .slides {
height: 1%;
}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
* include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}
/* FlexSlider Default Theme
*********************************/
.flexsliderContainer {
width: 100%;
float: left;
background:url(/images/1.png) repeat top center;
}
.flexslider {
margin: 0 auto 0 auto;
max-width: 1260px;
min-width: 1004px;
height: 223px;
position: relative;
zoom: 1;
/*background:url(/images/sliderbgNew.jpg) no-repeat bottom center #361529;*/
}
.flex-viewport {
max-height: 2000px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
transition: all 1s ease;
}
.loading .flex-viewport {
max-height: 300px;
}
.flexslider .slides {
zoom: 1;
}
.carousel li {
margin-right: 5px
}
.flexslider ol, .flexslider ul {
list-style: none;
margin: 0;
padding: 0;
}
/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a {
width: 30px;
height: 30px;
margin: -20px 0 0;
display: block;
background: url(images/bg_direction_nav.png) no-repeat 0 0;
position: absolute;
top: 50%;
cursor: pointer;
text-indent: -9999px;
opacity: 0;
-webkit-transition: all .3s ease;
}
.flex-direction-nav .flex-next {
background-position: 100% 0;
right: -36px;
}
.flex-direction-nav .flex-prev {
left: -36px;
}
.flexslider:hover .flex-next {
opacity: 0.8;
right: 5px;
}
.flexslider:hover .flex-prev {
opacity: 0.8;
left: 5px;
}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {
opacity: 1;
}
.flex-direction-nav .flex-disabled {
opacity: .3!important;
filter:alpha(opacity=30);
cursor: default;
}
/* Control Nav */
.flex-control-nav {
width: 1004px;
position: absolute;
bottom: 22px;
text-align: right;
right:150px;
}
.flex-control-nav li {
margin: 0 6px;
display: inline-block;
zoom: 1;
*display: inline;
}
.flex-control-paging li a {
color:transparent;
width: 12px;
height: 13px;
display: block;
cursor: pointer;
background:url(/images/noact.png) bottom right no-repeat;
}
.flex-control-paging li a:hover {
background:url(/images/noact.png) bottom right no-repeat;
}
.flex-control-paging li a.flex-active {
background:url(/images/act.png) bottom right no-repeat;
cursor: default;
}
.flex-control-thumbs {
margin: 5px 0 0;
position: static;
overflow: hidden;
}
.flex-control-thumbs li {
width: 25%;
float: left;
margin: 0;
}
.flex-control-thumbs img {
width: 100%;
display: block;
opacity: .7;
cursor: pointer;
}
.flex-control-thumbs img:hover {
opacity: 1;
}
.flex-control-thumbs .flex-active {
opacity: 1;
cursor: default;
}

.carouselContainer  {
width: 321px;
}
.carouselWrapper {
width: 265px;
position: relative;
overflow: hidden;
}
.carouselItems {
width: 10000px;
position: relative;
height: 129px;
background: url('/images/center.png') repeat-x left center;
}
.carouselContainerBlock {
float: left;
width: 77px;
padding: 27px 6px;
}
.carouselLink {
display: block;
width: 77px;
height: 76px;
overflow: hidden;
}
.carouselContainerLeft, .carouselContainerRight {
height: 129px;
width: 28px;
position: relative;
cursor: pointer;
}
.carouselContainerLeft {
float: left;
background: url(/images/left.png);
}
.carouselContainerRight {
float: right;
background: url(/images/right.png);
}
table .images{
	width: 336px;
}
   #wrapper {
   }
   #wrapper img {
	display: block;
	float: left;
   }
   #images, #thumbs {
	height: 350px;
	overflow: hidden;
   }
   #images {
	width: 350px;
	margin: 50px 0 25px 50px;
   }
   #thumbs {
	width: 450px;
	height: 129px;
   }
   #thumbs img {
	margin: 10px 5px 14px 5px;
	cursor: pointer;
				-webkit-box-shadow: #666 0px 2px 3px;
				-moz-box-shadow: #666 0px 2px 3px;
				box-shadow: #666 0px 2px 3px;
   }
   #thumbs img.selected, #thumbs img:hover {
   }
   .thumbsContainer{
	width:501px;
	background: url('/images/center.png') repeat-x left center;
	height: 129px;
   }
   .thumbsCont{
	float: none;
   }  
   .thumbsCont div{
	padding: 12px 0 0 0;
   }
   #prev, #next {
	width: 25px;
	height: 129px;  
	display: block;  
	text-indent: -999em;
	/*background: transparent url(http://coolcarousels.frebsite.nl/c/26/img/carousel_control.png) no-repeat 0 0;*/
	/*position: absolute;*/
	bottom: 85px;  
   }
   #prev {
float: left;
background: url(/images/left.jpg);
   }
   #prev:hover {
	left: 14px;
   }  
   #next {
	float: right;
background: url(/images/right.jpg);
   }
   #next:hover {
	right: 14px;
   }  

   .caroufredsel_wrapper #images img{
	text-align: left;
   }
   .caroufredsel_wrapper{
	margin: 0 !important;
   }

Прикрепленные файлы

  • Прикрепленный файл  main.css   18,92К   Количество загрузок: 95

 

 

  • 0

#2 Eugen4k

Eugen4k
    Topic Starter
  • Пользователь
  • 2 сообщений
  • Репутация: 0

Отправлено 12 Февраль 2013 - 16:21

неужели, никто даже совет не даст, как решить проблему?
  • 0

#3 Алия

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

Отправлено 12 Февраль 2013 - 21:23

Просмотрела все слайдеры по ссылке - такой же карусели, как у Вас на картинке, там не нашла. Слайдер под номером 48 совсем не похож.
Если картинки изначально менялись автоматически (как во всех других слайдерах на указанном Вами сайте), а у Вас перестали - возможно, вы допустили ошибки при копировании кода на Ваш сайт. Если нет - нужно разбираться в яваскрипте. Например, на html странице более-менее похожего на Ваш слайдера № 58 прописано:
<script type="text/javascript">
   $(function() {
	$('#carousel').carouFredSel({
	 width: 800,
	 items: 3,
	 scroll: 1,
	 auto: {
	  duration: 1250,
	  timeoutDuration: 2500
	 },
	 prev: '#prev',
	 next: '#next',
	 pagination: '#pager'
	});

   });
  </script>
где auto: указывает, что слайдер перелистывается автоматически с заданной скоростью (в миллисекундах). Но в других слайдерах автоматический скроллинг может быть прописан по-другому. Поэтому, если у Вашего слайдера изначально не работал автоскроллинг, вы можете: 1) поковыряться в коде самостоятельно; 2) обратиться за помощью к тем, кто разбирается в яваскриптах (для этого разместить вдобавок к html и css яваскрипты Вашего слайдера), 3) скачать похожий слайдер с автоскроллингом и настроить его внешний вид под свой сайт.
  • 0


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