You Think ATOMZEN is COOL?

BUY IT NOW here on DimeSale!
Menu

Metro Carousel and Tile

Default example

[cq_vc_metrocarousel displaystyle=”carousel” images=”3190,3178,3180,3176″ onclick=”lightbox” customlinktarget=”_self” tilecaption=”This is the default tile caption” slideeffect=”slideLeft” tileheight=”300″ mintilewidth=”320″ mintileheight=”180″ tileautoplayspeed=”4000″ carouselheight=”300″ position=”bottom-left” buttontype=”default” animation=”slide” buttoncolor=”fg-lime” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”yes” autoplayspeed=”4000″ containermagin=”0 0 0 0″ resizewidth=”800″ isarrow=””]

Different button, no slideshow

[cq_vc_metrocarousel displaystyle=”carousel” images=”3192,3193,3190,3177,3176,3175″ onclick=”lightbox” customlinktarget=”_self” tilecaption=”This is the default tile caption” slideeffect=”slideLeft” tileheight=”300″ mintilewidth=”320″ mintileheight=”180″ tileautoplayspeed=”4000″ carouselheight=”300″ position=”top-center” buttontype=”cycle” animation=”fade” buttoncolor=”fg-lightPink” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”no” autoplayspeed=”4000″ containermagin=”0″ resizewidth=”800″ isarrow=”no”]

Tile example

[cq_vc_metrocarousel displaystyle=”tiles” images=”3126,3139,3138,3137″ onclick=”lightbox” customlinktarget=”_self” tilecaption=”This is the default tile caption” slideeffect=”slideLeft” tileheight=”270″ mintilewidth=”450″ mintileheight=”200″ tileautoplayspeed=”3000″ carouselheight=”300″ position=”bottom-left” buttontype=”default” animation=”slide” buttoncolor=”fg-lime” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”no” autoplayspeed=”4000″ containermagin=”10px 0 0 0″ resizewidth=”800″ isarrow=””]
[cq_vc_metrocarousel displaystyle=”tiles” images=”3159,3160,3154,3152,3143″ onclick=”lightbox” customlinktarget=”_self” tilecaption=”Yet another tile, slide up down. Auto delay in 2 seconds.” slideeffect=”slideUpDown” tileheight=”300″ mintilewidth=”450″ mintileheight=”200″ tileautoplayspeed=”2000″ carouselheight=”300″ position=”bottom-left” buttontype=”default” animation=”slide” buttoncolor=”fg-lime” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”no” autoplayspeed=”4000″ containermagin=”10px 0 0 0″ isarrow=””]
[cq_vc_metrocarousel displaystyle=”tiles” images=”3177,3176,3175,3142″ onclick=”customlink” customlinktarget=”_self” tilecaption=”Support custom link, slide left right.” slideeffect=”slideLeftRight” tileheight=”300″ mintilewidth=”450″ mintileheight=”200″ tileautoplayspeed=”4000″ carouselheight=”300″ position=”bottom-left” buttontype=”default” animation=”slide” buttoncolor=”fg-lime” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”no” autoplayspeed=”4000″ containermagin=”10px 0 0 0″ resizewidth=”800″ customlinks=”http://go.atom.deals/atomzen,http://codecanyon.net/item/visual-composer-extensions-all-in-one/7731868?ref=sike,http://codecanyon.net/user/sike/portfolio?ref=sike,http://codecanyon.net/item/visual-composer-extensions-all-in-one/7731868?ref=sike” isarrow=””]
[cq_vc_metrocarousel displaystyle=”tiles” images=”3162,3161,3176,3177″ onclick=”lightbox” customlinktarget=”_self” tilecaption=”6 slide effects available” slideeffect=”slideRight” tileheight=”300″ mintilewidth=”450″ mintileheight=”200″ tileautoplayspeed=”4000″ carouselheight=”300″ position=”bottom-left” buttontype=”default” animation=”slide” buttoncolor=”fg-lime” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”no” autoplayspeed=”4000″ containermagin=”10px 0 0 0″ resizewidth=”960″ isarrow=””]
[cq_vc_metrocarousel displaystyle=”tiles” images=”3178,3180,3193,3192″ onclick=”lightbox” customlinktarget=”_self” slideeffect=”slideDown” tileheight=”300″ mintilewidth=”450″ mintileheight=”200″ tileautoplayspeed=”4000″ carouselheight=”300″ position=”bottom-left” buttontype=”default” animation=”slide” buttoncolor=”fg-lime” mincarouselwidth=”360″ mincarouselheight=”200″ autoplay=”no” autoplayspeed=”4000″ containermagin=”10px 0 0 0″ resizewidth=”960″ tilecaption=”This is the default tile caption” isarrow=””]

Another carousel example

[cq_vc_metrocarousel displaystyle=”carousel” images=”3139,3138,3137,3127″ onclick=”customlink” customlinktarget=”_blank” tilecaption=”This is the default tile caption” slideeffect=”slideLeft” tileheight=”300″ mintilewidth=”320″ mintileheight=”180″ tileautoplayspeed=”4000″ carouselheight=”360″ position=”bottom-center” buttontype=”square” animation=”slide” buttoncolor=”fg-lighterBlue” mincarouselwidth=”360″ mincarouselheight=”180″ autoplay=”no” autoplayspeed=”4000″ containermagin=”10px 0 0 0″ customlinks=”http://go.atom.deals/atomzen,http://codecanyon.net/item/visual-composer-extensions-all-in-one/7731868?ref=sike,http://codecanyon.net/user/sike/portfolio?ref=sike,http://codecanyon.net/item/visual-composer-extensions-all-in-one/7731868?ref=sike” isarrow=””]

Main features:

  • You can choose to display the image in Carousel or Tile mode.
  • Navigation button in Carousel support these position: bottom-left, bottom-center, bottom-right, top-left, top-center, and top-right.
  • Navigation button in Carousel can be one of these 3 type: default(short line), cycle, and square.
  • Navigation button in Carousel with 12 active color options available.
  • Slide animation support: slide, fade, switch, or slowdown in the Carousel mode.
  • Slide effect support: slideLeft, slideRight, slideLeftRight, slideUp, slideDown, and slideUpDown in the Tile mode.
  • Thumbnails support lightbox or custom link in both mode.
  • Auto play slideshow in both mode, you can customize the delay time in the editor.
  • Retina ready and responsive.
  • Metro UI CSS driven, include the necessary component only, keep the files lightweight.