1.5.?? Slideshow banner module shows all slides at page load

Quote

Post by DynaSpy » Thu Sep 15, 2011 2:27 pm

OpenCart 1.5.1.2
FireFox 6.0.2
Internet Explorer 9.0

While the banner module is loading, all slides become visible on the page until the page is fully loaded. This pushes everything down and causes a delay in page loading. I opted for the following solution:

catalog/view/theme/default/stylesheet/stylesheet.css

Code: Select all

/* banner */
.banner div {
	display: none;   <--ADD THIS LINE
	text-align: center;
	width: 100%;
}
catalog/view/theme/default/template/common/footer.tpl - ADD FOLLOWING CODE BEFORE </body> TAG

Code: Select all

<script type="text/javascript">
  $(document).ready(function() { $('#banner0').css('display','block'); }
</script>
It would be best to show the first slide immediately and then load the rest in the background, without disrupting the flow of the page. I'm sure there is a better workaround than this. Any ideas?

Regards,

Dan
User avatar
DynaSpy
Newbie
Posts
1
Joined
Thu Sep 15, 2011 2:03 pm
Top

Re: 1.5.?? Slideshow banner module shows all slides at page

Quote

Post by sketchi » Sun Oct 09, 2011 7:40 pm

Great! If you want to show the first banner straight away you could also add the following css in addition to what's mentioned above:

Code: Select all

.banner div:first-child {
	display: block;
}
User avatar
sketchi
New member
Posts
39
Joined
Wed Sep 22, 2010 5:04 pm
Top

Re: 1.5.?? Slideshow banner module shows all slides at page

Quote

Post by highvibes » Mon Oct 17, 2011 6:21 pm

If you use the 'slideshow' module instead of the 'banner' module this doesn't happen at all

:)
highvibes
New member
Posts
64
Joined
Sun Aug 07, 2011 10:38 pm
Top

Re: 1.5.?? Slideshow banner module shows all slides at page

Quote

Post by guntis.e » Sat Oct 22, 2011 5:28 pm

I have found out that it is enough to change only the stylesheet in a way that only the first banner image is displayed on the page load. No Javascript additions needed as the banner module changes the style attributes itself when loading.

So the only code to add/change in the stylesheet needed is this:

Code: Select all

/* banner */
.banner div {
   display: none;   <--ADD THIS LINE
   text-align: center;
   width: 100%;
}

.banner div:first-child {
   display: block;
}

Guntis
Image Partneris.lv - opencart web site development and support

guntis.e
Active Member
Posts
103
Joined
Fri Jan 28, 2011 4:20 am
Top
Post Reply
Return to “Bug Reports”
Who is online

Users browsing this forum: No registered users and 83 guests