5'li Flash Manşet Sistemi (HTML)

/* Easy Slider */
#slider-wrapper {
position: relative;
margin-bottom: 15px;
width:757px;
}
#slider ul, #slider li,
#slider2 ul, #slider2 li{
margin:0;
padding:0;
list-style:none;
}
#slider2{margin-top:1em;}
#slider li, #slider2 li{
/*
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/
width:757px;
height:300px;
overflow:hidden;
}
#prevBtn, #nextBtn,
#slider1next, #slider1prev{
display:block;
width:30px;
height:77px;
position:absolute;
left:-30px;
top:71px;
z-index:1000;
}
#nextBtn, #slider1next{
left:696px;
}
#prevBtn a, #nextBtn a,
#slider1next a, #slider1prev a{
display:block;
position:relative;
width:30px;
height:77px;
background:url(../images/slider/btn_prev.gif) no-repeat 0 0;
}
#nextBtn a, #slider1next a{
background:url(../images/slider/btn_next.gif) no-repeat 0 0;
}

/* numeric controls */

ol#controls{
margin:1em 0;
padding:0;
height:20px;
position: absolute;
right: 10px;
top: 10px;
}
ol#controls li{
margin:0 10px 0 0;
padding:0;
float:left;
list-style:none;
height:20px;
line-height:20px;

}
ol#controls li a{
float:left;
height:20px;
line-height:20px;
border:1px solid #151515;
background:#242424;
color:#fff;
padding:0 8px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
text-decoration:none;
}
ol#controls li.current a{
background:#4c4c4c;
color:#fff;
}
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}

/* // Easy Slider */

/**
* This <div> element is wrapped by jCarousel around the list
* and has the classname "jcarousel-container".
*/
.jcarousel-container {
position: relative;
}

.jcarousel-clip {
z-index: 2;
padding: 0;
margin: 0;
overflow: hidden;
position: relative;
}

.jcarousel-list {
z-index: 1;
overflow: hidden;
position: relative;
top: 0;
left: 0;
margin: 0;
padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
float: left;
list-style: none;
/* We set the width/height explicitly. No width/height causes infinite loops. */
width: 150px;
height: 150px;
border: 1px solid #cdcdcd;
}
.jcarousel-list li:hover,
.jcarousel-item:hover {
border: 1px solid #a9a9a9;
}


/**
jCarousel - Product Image Slider

*/
.jcarousel-next {
z-index: 3;
display: none;
}

.jcarousel-prev {
z-index: 3;
display: none;
}
.jcarousel-skin-tango .jcarousel-container {
background: #f8f8f8 url(../images/misc/bg_carousel.gif) repeat-x;
border: 1px solid #e9e9e9;
border-width: 1px 0px;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
width: 637px;
padding: 20px 60px;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
width: 75px;
height: 245px;
padding: 40px 20px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
width: 637px;
height: 116px;
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
width: 75px;
height: 245px;
}

.jcarousel-skin-tango .jcarousel-item {
width: 113px;
height: 113px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
margin-right: 15px;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
margin-bottom: 15px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
background: #fff;
color: #000;
}