OpenCart Community

Posted: **Thu Sep 16, 2010 8:16 pm**

This is quite a simple mod and i think actually makes the site look alot better when loading or navigating.

I didnt actually find anyone already mention this here before so i thought i would share it with you.

Modify your Header.tpl and insert between the <head> </head> tags

Code: Select all

<meta http-equiv="Page-Enter" content="BlendTrans(Duration=3.0)">

duration = length of time for the page to fade

content = type of effect

for a list of other effects visit http://www.aim-higher.net/meta-transitions.asp

I think many other browsers allow this to work, although i had heard safari doesnt?

Anyway, i personally like the blendtrans with a 3 second fade as it gives a good feel to the site.

Posted: **Thu Sep 16, 2010 9:23 pm**

Only works in IE it seems
No go in FF or Chrome

Posted: **Fri Sep 17, 2010 5:06 am**

hmm, shame, i guess for other browsers you will require some jQuery instead.

example

$('body').hide();
$('body').fadeIn(1000);

define some styles in the stylesheet too.

set it just before the closing body tag, so it works before the whole page is loaded.

Posted: **Fri Sep 17, 2010 5:18 am**

Using jquery:

1. EDIT: catalog/view/theme/YOURTHEME/template/common/header.tpl

2. FIND:

Code: Select all

</head>

3. BEFORE, ADD:

Code: Select all

<script type="text/javascript">$(document).ready(function(){ $('#container').hide(); $('#container').fadeIn(1000);});</script>

Posted: **Fri Sep 17, 2010 5:20 am**

haha thanks! i was close with my edit! lol

Thank you for this, will change it to your code straight away.

EDIT: one slight prob with that tho.

The buttons above the header dont fade with the rest of the page, nor does the country flag image?

Posted: **Fri Sep 17, 2010 5:29 am**

actually yours is more correct. I was only working with container. But body is more generic so use that

OpenCart Community

[MOD] Simple Page Fade Effect

[MOD] Simple Page Fade Effect

Re: [MOD] Simple Page Fade Effect

Re: [MOD] Simple Page Fade Effect

Re: [MOD] Simple Page Fade Effect

Re: [MOD] Simple Page Fade Effect

Re: [MOD] Simple Page Fade Effect