Disable preloader

Easily add amazing slideshow to your Joomla website with free Image Show module and manage them using slide manager
Rate this topic: Evaluations: 0, 0.00 on the average.Evaluations: 0, 0.00 on the average.Evaluations: 0, 0.00 on the average.Evaluations: 0, 0.00 on the average.Evaluations: 0, 0.00 on the average.Evaluations: 0, 0.00 on the average.
GK User
Fri Jul 05, 2013 12:44 pm
Is there any way to disable the preloader of ImageShow GK4?

As an alternative, is it possible to show the full height of ImageShow during the loading time?

Now, my menu 'falls' down as a consequence of the loaded ImageShow.

I'm using template GKCreative with ImageShow (CSS: GK Rockwall) activated on a newly created module position.
User avatar
Junior Boarder

teitbite
Mon Jul 08, 2013 11:56 am
Hi

Please show me Your site.
User avatar
Moderator

GK User
Mon Oct 07, 2013 5:49 am
Too bad the original poster didn't answer anymore as I have the exact same question. So I'm reviving this thread.

Is there a practicable way to disable the preloading in Image Show GK4? Or to at least have it preload with the height it'll have after having loaded the images?

What is bothering me is that when you enter the site, the preloading space is about 200 pixels high. After finishing to load the images it opens to the target height that you define in the backend of the module (640 pixels on my site) and it pushes the rest of the page down.

preloadisp.jpg


The development site lies at http://vkb.giges.de. When this thread will be old and the site published it will be at http://www.vkbonn.de.
User avatar
Fresh Boarder

GK User
Mon Oct 07, 2013 8:13 am
If your module height is 640px use below css code.

Code: Select all
.gkIsWrapper-gk_rockwall { height: 640px!important;}


Preloader should be in center. If you still want to hide it use below css

Code: Select all
.gkIsPreloader { display:none!important; }


You can add these css codes to override.css located in templates css folder and then enable css override option in template settings > advanced settings > css override "on".

If you are using responsive layout and have different height requirements then add them in appropriate files such as style1.css, mobile.css, tablet.css

See you around...
User avatar
Platinum Boarder

GK User
Mon Oct 07, 2013 11:15 am
Your solution helped me very much. I still have to experiment a little with the responsive version but you set me on the right path. Thanks a million!
User avatar
Fresh Boarder

GK User
Mon Oct 07, 2013 9:08 pm
You can also try duplicating module so you end with 2 modules. I haven't tested this but should be okay.

Lets say following are module ids
Code: Select all
#gkIs-gk-is-159
#gkIs-gk-is-160


In style1.css or template.css we add fixed height for first module and hide the second module.
Code: Select all
#gkIs-gk-is-159 .gkIsWrapper-gk_rockwall { height: 640px!important;}
#gkIs-gk-is-160 { display:none!important; }

Then in mobile.css we simply hide the first module and leave second module as it will be responsive.
Code: Select all
#gkIs-gk-is-159 { display:none!important; }
User avatar
Platinum Boarder

GK User
Tue Nov 05, 2013 3:38 am
I'm interested in this fix as well. What should happen is it shows the first slide, while the other elements are pre-loading. That is pretty common for any slider. The whole point of pre-loading is so that you don't have to wait for things to load. Having to wait in the very beginning and then have the page shift up and down after it loads essentially defeats the primary purpose in my mind.

Any solutions for this? Experimented with the JS and layout already it seems pretty hard coded into the slider, which explains why there hasn't been a good solution yet?

Also, the solution below might work, but then it doesn't work for responsive views, since you are fixing the height.
User avatar
Fresh Boarder

teitbite
Wed Nov 06, 2013 5:17 pm
Hi

Sorry but making the module show an image on start would require modification to the module engine and we do not support such big customisations. Why not to set a slide image to preloader ? :) You can also set the height to the preloader as well. So it would not resize till the preloader will dissapear and than will be replaced by slide already. I think a code like this can help with both requests at the same time:

Code: Select all
.gkIsPreloader {
min-heigth: 400px;
background-image: "../images/slide1.png";
}
User avatar
Moderator


cron