Monthly Archives: June 2014

Positioning the jQuery slider FeatureList style

Posted on by

Question:

I have used the FeatureList style.

In the software program the thumbnail images to the right of the main image can be clicked to skip to that image.

However once I have uploaded this to our website you cant click the thumbnails to skip to the corresponding image.

Answer:

You need to change the margin value of the Amazing Slider div, leave some space for the right side carousel.

In your webpage, try to find the following HTML code:

In your webpage, find the following code:

<div class=”slide-container”>
<div id=”amazingslider-1″ style=”display:block;position:relative;margin:16px auto 32px;”>

Change it to (change marked by red):

<div class=”slide-container”>
<div id=”amazingslider-1″ style=”display:block;position:relative;margin:16px 228px 32px 0px;“>

In the above code, 228 is the width of the right side carousel.

3D effect not working on Internet Explorer

Posted on by

Question:

The 3D horizontal effect runs differently on internet Explorer. Is this normal?

Answer:

The 3D effect does not work on Internet Explorer, because Internet Explorer has a poor support for CSS3.  It will fall back to slice effect by default.  You can also change the fallback effect in Step 3, Transitions dialog.

Text outside jQuery Slider not showing on webpage

Posted on by

Question:

I have the commercial version of your software.

I am attaching the most recent saved version of our project. As you can see in the project, each of these images has a title and a description. However, neither are showing on the website. It is imperative that the title and the description DO NOT overlap the image as these are of original art work. I have changed the slider skin numerous times and when I change the Text Effect to overlay the image – it is there. However, if I change the Text effect to be outside the image either on top or the bottom, it does not show.

Please let me know what the issue might be.

Answer:

The text is actually there on your webpage, but the parent div of the slider has a “overflow:hidden” css property, so the text is hidden.

You can find the following HTML code in your webpage:

<div style=”margin:0px auto;max-width:350px;”>

<!– Insert to your webpage where you want to display the slider –>
<div id=”amazingslider-1″ style=”display:block;position:relative;margin:0px auto 0px;”>

Change it to (change marked by red):

<div style=”margin:0px auto 60px;max-width:350px;”>

<!– Insert to your webpage where you want to display the slider –>
<div id=”amazingslider-1″ style=”display:block;position:relative;margin:0px auto 0px;”>

Insert Amazing Slider and Amazing Audio Player to one page

Posted on by

Question:

I am using Homestead and love using your product. Until now, I have only used the commercial slider. I downloaded the free version though today of the Audio player, to make sure it would work in conjunction with the slider before I purchased it. I am having difficulty having both of them show up together though. When I upload each one by themselves they work, however, when I have them both on there at the same time, only the slider shows up. I tried to change the ID on the audio player, but that did not do anything. What would I need to do to make those work properly on the same page? I uploaded each slider to its own folder as well so they are not in the same folder.

Answer:

The head section of the slider may be look like:

<script src=”http://amazingslider.homestead.com/homeslider/jquery.js”></script>
<script src=”http://amazingslider.homestead.com/homeslider/amazingslider.js”></script>
<script src=”http://amazingslider.homestead.com/homeslider/initslider-1.js”></script>

The head section of audio player may be look like:

<script src=”http://amazingslider.homestead.com/homeplayer/jquery.js”></script>
<script src=”http://amazingslider.homestead.com/homeplayer/amazingaudioplayer.js”></script>
<link rel=”stylesheet” type=”text/css” href=”http://amazingslider.homestead.com/homeplayer/initaudioplayer-1.css”>
<script src=”http://amazingslider.homestead.com/homeplayer/initaudioplayer-1.js”></script>

When adding both code snippets to your webpage, you need to remove the second jquery.js line. That’s, if you add the code of slider first, then follows the player code, you need to remove the jquery.js line in the player code. If you add the player code first, you need to remove the jquery.js line from the slider code.

Image Quality in Responsive Slider

Posted on by

Question:

I am a registered member.

I have the image slider on my webpage.

The images displayed seem to be of less quality than the original picture used. I have attached one of the images that are have been used for you to compare.

Answer:

In the application, Add Slides dialog, you have setup the size of the slider as 280 * 200. But on your webpage, the size of the slider is 333 * 238, that’s, bigger than the original size.

Since the slider is responsive, the images are stretched to 333 * 238.

To fix the problem, in the application, you can setup the slider size as 333 * 238 or a bigger size.

If you would like to disable the “responsive”, in the application, Step 4, Options dialog, uncheck the option “Create a responsive slider” (Version 3.2 and after) or “Support responsive web design” (Version 3.1 and before).

Cannot control the height and width of slider in website

Posted on by

Question:

I am using photoshop slices to create my website.

When I paste the amazing slider codes, the slices go all over the places. Can you tell me where I can control the height and the width of the amazing slider?

I am not a professional user and not an expert on scripting.

Amazing program by the way, makes the job a lot easier for lay users like myself.

Thanks…

Answer:

Do you mean the jQuery slider extends itself to full width of your page?

To fix the problem:

1. Define the width and height of the slider in step 1, “Add Slides” dialog.

2. In Step 4, Options dialog, there is an option “Support responsive web design”, please uncheck this option. This option will be renamed as “Create a responsive slider” in next version.

How to upgrade Amazing Slider to the latest version

Posted on by

You can take the following steps to upgrade Amazing Slider to the latest version:

1. If you have lost your activation code, you can resend it at https://amazingslider.com/sendcode/.

2. Download the Amazing Slider latest version at https://amazingslider.com/downloads/.

3. Install the software on your computer.

If you are installing the software on the same computer, the new version will find the registration information saved by the old version and register itself.

If you are installing the software on a new computer, you need to uninstall the software from your old computer firstly.

Thumbnail images of jQuery Slider

Posted on by

Question:

I have a technical question – I notice that when I generate a slideshow, the thumbnail images are as large or larger than the slideshow images even though they are much smaller images. For this reason I only use skins without thumbnails (like Header) and delete all “-tn” images before upload. Is this something that will be fixed in the future? Even with the “Header” skin selected, the thumbnails are generated.

Answer:

Currently, the width of the generated thumbnail images is 240px, and the thumbnail images are generated for all skins.

For most skins, even they do not display the thumbnails, they still need the thumbnail images for the “popup” on the navigation bullets.

If you want to hide the “popup” on the navigation bullets, in step 2, Skins dialog, Controls tab, uncheck the option “Show popup preview on navigation”.

Multiple jQuery sliders on one page of Homestead website

Posted on by

Question:

I am using homestead to build my website.

I purchased your amazing slider and it was working until I tried two sliders on one page. I removed the two lines you suggested based on the link:
https://amazingslider.com/how-to-add-an-image-slideshow-to-homestead-website/ but it still does not work. I have attached the html to see if you can figure out what is wrong. All of the file name paths appear to be correct.

I have confirmed the slider worked on its own page when it is the only slider.

Answer:

For the second slider, when publishing the slider, in the application, Publish dialog, in the bottom left of the dialog, you need to setup a different “Slider id” for it, for example, you can change the value to 2.

I have also updated the information in the section “Adding multiple sliders to one page” of the tutorial.