Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Archive /

Our old forums are still available as a read-only archive.

Moderators: martimiz, Sean, biapar, Willr, Ingo, simon_w

Small Sifr Problem


Reply


4 Posts   1674 Views

Avatar
TerryMiddleton

Community Member, 108 Posts

29 April 2009 at 11:18am

I am having a slight sifr problem that I'm hope to easily fix.

I install sifr (works great) with no problem, except for one small issue.

When I go to a page on the site, the html (h1 in this case) will show for about 1-2 seconds and then be replaced with the sifr font.

How can I get it so the html does not show and only the sifr shows with out a transition?

Thanks,

Terry

Avatar
banal

Community Member, 901 Posts

29 April 2009 at 6:59pm

Hi Terry

sIFR initializes upon the window "onLoad" Event. This can cause lags, because the onLoad event fires when external resources like scripts and css have been loaded. There's an alternative to the onLoad event though. JavaScript libraries like jQuery, Mootools or Prototype allow you to listen for an event that's being fired when the DOM is ready. If you're not using any of these libraries yet, you could also implement it yourself:
http://www.javascriptkit.com/dhtmltutors/domready.shtml

So what you could try is to initialize sIFR inside a dom ready event. This way, sIFR will be initialized before "onLoad".. this should solve your problem.

Avatar
TerryMiddleton

Community Member, 108 Posts

29 April 2009 at 9:07pm

banal,

Thank you for the reply. So this begs a couple questions that I'm curous about.

1.) Not fully understanding how SS is implemented and runs, are there scripts and css being loaded which are are not needed?

How can I see what scripts are being loaded. I looked at the source, but don't see all the .js files references. Are they being loaded somewhere else that I'm not aware of?

2.) How in the world do you implement what you are suggesting here. Can SS do this?

I wish I was smarter than I am in SS, javascript, and PHP functions/classes. I'd be further along than I am.

I appreciate your help very much.

Terry

Avatar
banal

Community Member, 901 Posts

29 April 2009 at 11:10pm

Hi Terry

I'm not sure how your site looks, but most sites have external files. JavaScript may not be the case, but definitely CSS files? You can easily inspect the files that are being loaded (and their loading time) by using the Firebug extension for Firefox (http://getfirebug.com/). It's an extension every web-developer should have installed.

What I wrote and how you implement it has actually nothing to do with SilverStripe nor with PHP. Its a pure client-side issue (eg. what's running in the webbrowser. This is usually JavaScript embedded in HTML or sometimes flash).
This is how you could implement it using jQuery. The following code should be placed in the <head> of your template

<script src="jsparty/jquery/jquery-packed.js" type="text/javascript"></script>
<script src="mysite/javascript/sifr.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
jQuery(document).ready(function(){
   sIFR.setup();
});
-->
</script>

Using jQuery just for the DOM ready event is admittedly a bit overkill, but I'd give it a try just to see if it works. Another thing to try (without the use of jQuery) would be to place the following code just before the closing </body> tag!

<script type="text/javascript">
<!--
if(typeof sIFR == "function"){
   sIFR.setup();
};
-->
</script>

The latter is probably better if you don't need jQuery for other stuff on your site.