• Resolved bluebeard

    (@bluebeard)


    hi dalton,
    i have to say this plugin is sheer genius and it’s saved us hours of manual hell!

    i just have a question.. you see, before the first image loads (fades in), nothing happens, which misleads users into thinking nothing is going to appear.. until the image fades in.

    is there a way to remove the fadeIn(); so that users can see the image loading, or at least a way to define a border around the area so that the user can expect that something is going to load in that space?

    of course the ideal solution would be to add a preloader but a faster solution could be to remove fadeIn(); or add a border.. which i have no idea how to do.. any ideas?

    thanks in advance!

Viewing 15 replies - 1 through 15 (of 21 total)
  • I have about the same problem and i just posted :), if there is no solution, what would i need to do to install a preloader ?

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    The fade-in is there because occasionally some weird stuff happens if the slideshow is displayed before the page is fully loaded – mostly related to detecting the size of the container and placing everything correctly. I delayed the load of the slideshow until the files are downloaded, so that everything can be sized correctly. Of course this can cause a delay if you’ve got a lot of image files to download or a slow connection.

    My preference would be to show the slideshow as soon as the first image is completely downloaded, but I haven’t figured out how to do that. I think I may be able to attach a class to the first image and detect when it is available, but I’m not sure. It’s going to take a little while to figure out.

    In the meantime, what do you think about a small animated “loading” graphic that can be replaced by the slideshow once it is ready?

    Dalton

    In the meantime, what do you think about a small animated “loading” graphic that can be replaced by the slideshow once it is ready?

    Thats exacly what im looking for :D, of course the first option would rock even more but whenever you get the time to do that ??

    and by the way sorry for intruding your post bluebeard, i have the exact same issue.

    Thread Starter bluebeard

    (@bluebeard)

    no problem Mickael and thanks for the solution, Dalton! that would be perfect actually. how do we go about doing that? i’ve tried to delve into the CSS and PHP but haven’t found a way to insert a loading gif or a border. really appreciate your help so much and thanks for replying so fast! this plugin is a lifesaver.

    Thread Starter bluebeard

    (@bluebeard)

    hi again Dalton, so i tried messing with the css to define a border around the image container but it doesn’t work either. is that because everything only loads once the first image is loaded? i was just thinking.. a quick way to solve it would be to wrap a div around the container and then specify a border.. but couldn’t get it to work either! any quick and simple ideas for a fix?

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    Hi Bluebeard –
    I don’t have the time to do a proper release, but here’s a version of the plugin with a loader.gif: https://daltn.com/x/ps052b

    I just threw in a div before the actual slideshow with the loader as a background, then once the window is fully loaded, that div is hidden and the slideshow is shown. Neat, eh?

    Cheers,
    Dalton

    Thread Starter bluebeard

    (@bluebeard)

    hi dalton,

    wow thanks for your precious time! so i deleted the old plugin and replaced it.. somehow it doesn’t seem to be working. same thing happens. i can’t figure out what might be wrong.. couldn’t be a jquery conflict since the old one worked..? hmm…

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    Is the plugin not working at all, or just the new loader that isn’t working? Which version of the plugin were you using previously?

    It seems like the loader was disappearing too quickly on my previous version, here’s a link with a new delayed loader: https://daltonrooney.com/portfolio-dev/archives/328

    The same download link will get the new version for you.

    Dalton

    Thanks a lot dalton, works perfectly for me.
    Only thin was the size and the animation, but i changed some css and downloaded a new animation at https://ajaxload.info/ ??

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    Yeah, it’s hard to predict what the size of the slideshow is going to be until the page is loads, so I figured you would want to customize it – which is nice and easy. Cheers.

    Thread Starter bluebeard

    (@bluebeard)

    Hello again Dalton,

    Wow, thanks for upgrading the plugin! It’s surely working fine on your site.

    In the previous first version (with preloader) the slideshow was working fine as usual just that there was still no preloader.

    So i installed this latest update and i notice that in the settings page there’s an option for “loading animation”. All was working fine as usual (without any preloader) till i ticked that option, and the slideshow just didn’t appear anymore. I’m just thinking could it be some kind of ajax or jquery kind of conflict. I’m using quite a number of .js files and javascripts in my header.php.

    Here they are:

    —————————–

    1. jquery.js
    2. smoothscroll.js
    
    <script type="text/javascript">
    jQuery(document).ready(function($){
    	$("img.a").hover(
    		function() { $(this).animate({"opacity": "0"}, "fast"); },
    		function() { $(this).animate({"opacity": "1"}, "fast"); }
    	);
    });
    </script>
    <script type="text/javascript">
    $(document).ready(function()
    {
    
    	//slides the element with class "menu_body" when mouse is over the paragraph
    	$("#firstpane p.menu_head").mouseover(function()
        {
    	     $(this).css({backgroundImage:"url(down.png)"}).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
             $(this).siblings().css({backgroundImage:"url(left.png)"});
    	});
    });
    </script>
    <script type="text/javascript">
    
    $(document).ready(function(){
    
    	$('#bgg').fadeIn(800);
    
    });
    
    </script>

    —————————–

    Being the java noob i am, i’ve no idea which part of it has messing up the functionality of the portfolio slideshow plugin.

    Anyhow, thank you once again for your precious time to develop this amazing plugin! Hope we can find the light thru the tunnel..

    Peace,
    Lee

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    Hey Lee,
    Can you post a link? I’ll take a look later today. And also, make sure you clear the cache on your site, if you have one, and on your browser, too.

    Thread Starter bluebeard

    (@bluebeard)

    I’d be glad to!
    If you could give me your email address i’ll drop u a mail with the link and login. thank you so much!

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    Hey Lee,
    It’s [email protected]

    Plugin Contributor Dalton Rooney

    (@daltonrooney)

    Looks like bluebeard found a bug in the plugin that causes the slideshow to fail if the preloader is selected and the nav is at the bottom. I’m working on a fix and will release it to the repository asap.

    Dalton

Viewing 15 replies - 1 through 15 (of 21 total)
  • The topic ‘[Plugin: Portfolio Slideshow] remove fadeIn();’ is closed to new replies.