This author's response time can be up to 1 business day.
Dear David! Another great project from you which I bought
One desire that other people have been asking: what to change/add in this script in order to pauze the banner temporarily while a visitor’s is hovering a on the banner image/text?
I have NO other wishes because this is the best banner slider currently on the entire codecanyon (trust me I’ve played with all of them before deciding on this one). Cheers and looking forward to youir answer!
Hello, thank you, that feature is not yet part of the plugin, and I haven’t get the time to make it, but it sounds like a good update
Great plugin – I just bought it!
Hi, what do you mean? can you extend?
I also tried the simpler HTML implementation to no avail. Can you please help me, at least with the HTML implementation?
The slider can be found here: http://www.awardscy.com
Just to add a note – the slider resides in it’s own directory /slider under root, and all paths have been changed to reflect this change. I only get the loading.gif instead of the images
Doh! Thanks a lot!
Hi, you have 2 instances of jQuery on your page, try leaving just one
You mean I can’t have the slider and the gallery on the same page? Is there a way around it?
Yes you can, you don’t need several instances of jQuery on your page, just one before all JS files.
Still not working Could you pls tell me what exactly to get rid off – thanks for your awesome support,
you forgot to uncomment the slider, lets see if that works
Uhh, I don’t see it..
try using the HTML version
Ok great, David, that worked. But only until I added the options for the slider. It tells me there is a syntax error and wants me to take out the commas behind the options. When I do that the options are just ignored (but the slider works then).. I really need to get rid off the timer line and the arrows. Pls help.
theme : 'theme1',
navBarNumeric : true,
autoHidePlayBtn : false,
Thank you! You’re the best.
Hi David, I’m just a little confused with a couple things. First, I couldn’t get the php method to work, should it work on a regular html page? I got the alternate html method to work but can I still use the “random” feature with this method? Finally, none of my icon images are showing up and im not sure where I have to change the path for them. All files are in the same plugin folder with the same structure as you have them, the only difference is I renamed the folder “plugin” to “slider”. Thanks.
Hello, the PHP method needs PHP, so you must be certain that you can run PHP code (for example in a server). Hmm but any chance you could show me a living example online? so I can inspect it
Thanks for the reply. Yes, the server can run php (hosting with Hostgator). I know with some form php scripts in the past I had to rename the extension of the page from .html to .php? I sent you an email with link to the site so you can take a look. Thanks.
I answered you via email
Thanks. I replied to your email again, the php slider is working now but the icon images are still not showing on either html or php slider.
Its weird because the ‘loading’ gif appears but next/prev arrows don’t.
Sorry for the delay I responded to your email again
Just bought his, thanks for all your efforts – a very useful bit of code.
I have one question though, is there a way to specify the height like you can the width?
Currently if you apply it to a folder of images with differing Y dimensions, it adapts dynamically on each image. This is best for most uses, but I’d like to be able to fix the height to suit a particular application.
Thanks in advance.
Currently the plugin respects the default height (in order to keep the right proportions) the only way around would be to cut the image (the file) to the height of your desire and then let the plugin use it
I wouldn’t want to distort the AR, but would it be possible/difficult to add an (optional) height constraint too, such that if the height is the limiting factor, this is used to calculate the re-sizing?
I really love the benefit of not needing to build the slideshow manually, having to re-size images would offset a lot of this benefit.
I haven’t done it my self, but you can try to add a resizing PHP method in the slider.php file, or use a CSS technique to set a max-height, for example:
max-height: 300px !important;
Just purchased your plugin. Looks good. One detail I can’t make work : where (what file) do I change the speed of transition and the interval between the slides?
I am using the plugin folder to work. I tried changing the parameters in js/slider.jis but it did not reflect the changes. What am I doing not right?
you must change it in the JS initialization of the plugin where you pass all the options available i.e.
transitionSpeed : 400
Hmm, can you tell what exact file?
I added the line to index.php in plugin folder but it does not work
in the file where you initialize the plugin, if this isn’t working can you show me a living example that I can inspect?
the interval between the slides is too short and the fade effect is somewhat strange
playInterval : 4000, //Time between transitions when auto play is on
David, I appreciate your help, but to be honest I don’t understand why the index,.php is not reading the parameters from slider.php. Can you be more specific? I sent you the page to check. Did you?
I did inspect your page, and you currently have this in your source code:
playInterval : 8000,
Hello, is there a way of initialising the slider on dynamically loaded images? I’m getting a list of images via AJAX, and the $(window).load() function doesn’t seem to work in the $.ajax() success function.
I’m guessing something may be possible using jQuery’s deferred object, but of course I’d rather not have to dive into all that if you already have an answer!
Thanks in advance,
I haven’t try this, but did you try to load them via AJAX, and then use the imagesLoaded plugin and then initialize the plugin?
what about an Update with image LAZYLOAD function ?
How big are the CSS and JS files?
Currently there’s no lazy load feature.
All JS files needed (including jQuery) are 167kb and the CSS is 7kb
O.k., thank you
Hi i bought Media Boxes from you. I was wondering if i can integrate this to that one. Do you think that can be doable? Thank you and best regards
the only way I can think of is using an iframe in the lightbox of the Media Boxes and then embed the iframe inside like another page
We recently purchased your Ultimate Smart Slider and it works great. The only thing is we’d like to have the directory polled once the images have been displayed to check for any new images that might have been added to the folder. Is there an easy way to do this?
Also – we do have 2 or 3 separate sliders running on the same page (one to show landscape images from one folder and one to show portrait images from another). This is for a charity event we have this week.
currently the plugin doesn’t have a feature to check via ajax if there was some kind of movement in the folder in real time, only after a page refresh,
about multiple sliders in one page, yes you can, see here: http://www.davidbo.dreamhosters.com/plugins/slider/documentation/index.html#multiple the section of “Multiple sliders in one page”
Thanks for the quick reply.
Hello. I got into the slider and is experiencing a problem.When put to link is occurring failures. When there is no link slider functions normally. Any changes needed? The example with the error is in http://www.iscaecompanhia.com.br/2014/slider/index.php
there may be a problem with placing extra html markup on the slider, but what if you try to do it with JS, for example in the HTML img tag add this attribute: onclick="location.href='http://google.com'"
something like this:
<img onclick="location.href='http://google.com'" />
Thank you. Added the onclick and style pointer cursor to appear better identify and stayed perfect.
Running the strict HTML version, not the auto version… is there anyway to place a “read more” button in the caption?
<img src='images/b-img2--.jpg' data-effect='boxesDiagonal' data-captioneffect='fade' data-caption="Caption Here <a href='http://www.google.com'>click me!<a/>" />
Hello, purchased item. Is there a way to grab images from specific folder without use of php? thanks
currently I’m now aware of another way (other than using a server side programming language, like PHP, Java, Phyton, .Net etc)
Can not be used . The request for a refund.
not sure why can’t be used, but if you are looking for a refund you need to contact Envato directly (since they handle all that has to do with money, authors don’t have the tools to do so)
you can contact them by opening a ticket here: https://help.market.envato.com/hc/en-us/requests/new
Hi I just bought your slider and it looks great except one thing. I use the it “the html way” but I can only get two of the four images to show. Don´t understand what I have done wrong? Any idea?
Maybe there’s some HTML markup error, any chance you could show me a living example of this issue so I can see what might be wrong?
Absolutely. Please take a look at http://web2d2.com/tandlakarpraktik/
GREAT! Thanks! That did it…
But wait, now it does not fade anymore. It gets squared fading if you know what I mean…take a look again.
Ohh yeah, that’s the “boxes-zoomOut” effect, if you want a fade effect just replace it for “fade” instead
That was extremely stupid of me. Thanks
I bought the slider but its come with PHP files.
I need html files.
By default the plugin uses PHP in order to scan a folder of images and print them in the slider, but you can use HTML only, so try this:
1) Remove the slider.php file
2) Rename the index.php file to index.html
3) Inside the index.html file remove these lines:
<!-- INCLUDE THE SLIDER.PHP FILE FOR THE AUTOMATIC SLIDER-->
THE JUST HTML VERSION
<div class="as_slider" id="slider1">
<img src="images/img2.jpeg" data-effect="boxesOrder-zoomOut" data-captioneffect="fade" data-caption="<h4>Caption here. </h4>" />
<img src="images/img3.jpeg" data-effect="boxesDiagonal" />
<img src="images/img1.jpeg" data-effect="boxes-zoomOut" />
And that’s it, no PHP needed
I hope it makes sense
Nice slider, but I couldn’t find a way to use images with different dimensions. That would be what I expect from an automated slider. Even when I have pics that don’t exceed my max dimensions, they are stretched out if smaller. When I remove auto width, pics are seen on top of each other. Is there any solution for this?
Thanks a lot.
by default the slider will try to cover the 100% of its container, so if you want to change the width of the slider just set a static width to the container, something like this:
<div style="width: 700px;">
<!-- PUT THE SLIDER HERE -->
height: 200px !important;
Thank you, but this does not do it. The dimensions of the slider is no problem.
I have a bunch of images with different dimensions, but they all have a maximum of 680px width and max 453px height. The only thing I want is them keeping their aspect ratio and appear centered in this 680×453 slider. Without stretching out of ratio. Hope this is possible, since a common situation. Thanks.
by default this is not possible, but we can tweak the plugin a little so that the slider adapts to the original width and height of your images, so just do the following:
Open the slider.js file (and use this file in your html page instead of the slider.min.js) and find this:
'max-width' : container.width()
'height' : imgs.eq(current).height()
'width' : 'auto'
'height' : imgs.eq(current).height(),
'width' : imgs.eq(current).width()
Thanks. That seemed to make sense, but … Now the images come on top of each other, so when you first have a big one and then a smaller one, the new big one will be seen outside of the edges of the new smaller one and so on.
We should only see the top pic of the stack. How to avoid that?
var currentImg = imgs.eq(current);
'height' : currentImg.height()
var currentImg = imgs.eq(current).css('width', 'auto');
'height' : currentImg.height(),
'width' : currentImg.width()
max-width: none !important;
Ok, that works beautifully. Now just one more thing: I have thumbnails showing on hovering the navigation buttons and in case of a portrait thumbnail, this is bleeding downwards out of the landscape rectangle. Thus distorting the show on hover effect. How to keep ‘m inside of this thumbnail rectangle? Thanks!
left: 0 !important;
width: 100% !important;
text-align: center !important
Sorry, that is not what I meant. I had the bullets centered already, but when hovering a bullet, a thumbnail appears. That thumbnail is ok if horizontal, but not if vertical, because the vertical (portrait) thumbnails overflow downwards the container and so disturb the hovering. I want the thumbnails to be contained within their normal container height. Thanks.
I don’t quite understand, can you show me a living example online so I can see what’s going on? you can send the link privately via email through this form: https://codecanyon.net/user/castlecode#contact
Wow, I wanted to make a screenshot, since I don’t have this online yet, but … the problem disappeared wonderfully! Must have been a cache issue or something, I guess. Sorry to have bothered you. Looks perfect now. Thanks.
awesome glad to hear it works great now
In the end it became clear that this issue was only solved after removing some height stuff from .as_slider img in css.
I’m glad everything is working fine now
Use, by you or one client, in a single end product which end users are not charged for. The total price includes the item price and a buyer fee.
Use, by you or one client, in a single end product which end users can be charged for. The total price includes the item price and a buyer fee.
View license details
Get it now and save up to $3
Unlimited downloads only
$29 p/m on Envato Elements
Download over 18,000 items now
Learn almost anything with
Envato Tuts+ for free
9000 free tutorials, 3000 paid courses
Designers matched perfectly to
you on Envato Studio
2000 artists ready to undertake your work