Monthly Archives: August 2014

Add web link to carousel content template

Posted on by

Question:

I’m wondering if there is a __LINK__ var or else as there are are for TITLE and DESCRIPTION carrousel item
I’m trying to manage a specific content template and i would like to use such a variable.
Maybe it is available in the last carrousel version ?

Answer:

Yes, it’s called __HREF__

For example, you can use the following code for content HTML template:

<div class="amazingcarousel-image">__IMAGE__</div>
<div class="amazingcarousel-title">__TITLE__</div>
<a href="__HREF__" target="_blank">Read More</a>

With the above content HTML template, you can create a carousel like following:

Autoplay jQuery carousel and display URL in carousel title

Posted on by

Question:

I love your amazing slider and all other tools you are offering. Now, in this case – I would like check if I can use the JQuery Carousel, to show mp4 videos of property listings. Please let me know the following:

– Could it be set to autoplay, so that the Carousel is moving within a preset time

– Could the text title be an URL, which points to a description page on the website – or maybe the title replaced by an image icon with URL.

Answer:

In the application, step 2, Skins dialog, you can check the option “auto play”.

HTML tags are supported in Version 2.2 and after. If you are not using the latest version, you can goto our website https://amazingcarousel.com/downloads/ to download it.

You can use HTML tags in the title and description, for example:

<a href="https://amazingcarousel.com" target="_blank">Amazing Carousel</a> rocks!

You can also add an image link to the title, for example:

<a href="https://amazingcarousel.com" target="_blank"><img src="http://www.yourwbsite.com/yourimage.png" style="border:0;" /></a>

In the above code, http://www.yourwbsite.com/yourimage.png is the URL link to your image.

Change visible items according to screen size

Posted on by

Question:

I bought a license for Amazing Carousel and it is freaking awesome. I love how extensible the css and js is.

I have tinkered with the media query in the initcarousel-1.js file and am delighted how flexible the carousel adjusts to screen widths.

mobile: {
  screenwidth: 600,
  visibleitems: 1
}

I would like to be able to have 1 item displayed when over 840px wide, 2 if under 840 but over 640, and back to 1 again for under 640. I’ve tried tinkering with that code and got error messages every time. Any clever concise way to do this without resorting to way more js than I want to deal with?

Many thanks for a great product!

Answer:

In the application, step 2, skins dialog, overview tab, change “Visible items” to 1.

In the same tab, change the screen query to following:

{
  medium: {
    screenwidth: 840,
    visibleitems: 2
  },
  mobile: {
    screenwidth: 640,
    visibleitems: 1
  }
}

With the above change, the carousel will have 1 item by default, it will change to 2 items when the screen size is under 840, and go back to 1 when the size is under 640.