Comments

• 

  Slightly less kruft...?

  Jonny Bradley Tue 22 of Mar, 2011 23:38 GMT-0000

  Hi

  I just had to implement a tiny carousel thing on a 6.2 site recently (and didn't have time to make the plugin i've been meaning to for ages) so here's what i ended up with:

  Infinite Carousel on 6.x markup

  Copy to clipboard

  {DIV(class="small_carousel")}
  * {img fileId="18" height="120" width="180"}
  * {img fileId="19" height="120" width="180"}
  * {img fileId="20" height="120" width="180"}
  * {img fileId="21" height="120" width="180"}
  * {img fileId="22" height="120" width="180"}
  * {img fileId="23" height="120" width="180"}
  * {img fileId="24" height="120" width="180"}
  * {img fileId="25" height="120" width="180"}
  * {img fileId="26" height="120" width="180"}
  * {img fileId="27" height="120" width="180"}
  * {img fileId="28" height="120" width="180"}
  * {img fileId="29" height="120" width="180"}
  * {img fileId="30" height="120" width="180"}
  {DIV}
  {JQ()}$('.small_carousel').tiki("carousel", "", {
      displayThumbnails : false,
      textholderHeight : false,
      transitionSpeed: 2000,
      displayTime: 2000,
      displayProgressBar: false,
      showControls: false,
      easeLeft: 'jswing',
      easeRight: 'jswing',
  });{JQ}

  
  and css was

  css

  Copy to clipboard

  .small_carousel {
  	height: 120px;
  	width: 180px;
  	overflow: hidden;
  	position: relative;
  	padding: 0;
  	margin: 0;
  }
  
  .small_carousel ul {
  	position: relative;
  	padding: 0;
  	margin: 0;
  }
  
  .small_carousel li {
  	display:inline;
  	float:left;
  	background-image: none;
  	padding: 0;
  }

  
  Hope it helps