Trying out head.js - before


/ Published in: JavaScript
Save to your folder(s)



Copy this code and paste it in your HTML
  1. <!--[if lt IE 9]>
  2. <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  3. <![endif]-->
  4.  
  5. <script type="text/javascript" src="http://www.google.com/jsapi"></script>
  6.  
  7. <script type="text/javascript">
  8. google.load("jquery", "1.4.4");
  9.  
  10. google.setOnLoadCallback(function() {
  11. jQuery('#pageBackground').fadeIn('1500');
  12. jQuery('section').delay('900').fadeIn('1500');
  13. });
  14. </script>
  15. <script type="text/javascript">
  16. //resize background script from example at http://css-tricks.com/perfect-full-page-background-image/
  17. $(function() {
  18. var theWindow = $(window),
  19. $bg = $("#pageBackground"),
  20. aspectRatio = $bg.width() / $bg.height();
  21.  
  22. function resizeBg() {
  23. if ( (theWindow.width() / theWindow.height()) < aspectRatio ) {
  24. $bg
  25. .removeClass()
  26. .addClass('bgheight');
  27. } else {
  28. $bg
  29. .removeClass()
  30. .addClass('bgwidth');
  31. }
  32. }
  33. theWindow.resize(function() {
  34. resizeBg();
  35. }).trigger("resize");
  36. });
  37. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.