Eliminating extra space in the header

[jimcamut 0]

My situation: I'm trying to figure out how to take out the extra space in my header that is only showing up in IE8 and Firefox browsers, but not in Safari or Chrome. I'm using a Flash .swf file for the header that might be causing the problems. Any idea how to fix this? Let me show you what I'm talking about... as opposed to...

[jimcamut 0]

And my URL is http://jimcamut.com/ if that's not obvious by my screeshots,

[bryan-hadaway 3]

Hmm, is it highly desired to use Flash, could this be done effectively with a static image, animated gif or transitioning JS images instead? Thanks, Bryan

[jimcamut 0]

I could, but I'm using the "Query Image Lazy Load WP v0.10" plugin and it was lazy loading my header and feature slides. I'm not not that great with code, so I was using flash as a work-around to avoid the lazy load. I don't know if this is asking too much, but would you know how I could apply this plugin so the lazy load would only affect the images in certain div containers?

<?php
	
	  /*
	  Plugin Name: jQuery lazy load plugin
	  Plugin URI: http://github.com/ayn/wp-jquery-lazy-load/
	  Description: a quick and dirty wordpress plugin to enable image lazy loading.
	  Version: v0.10
	  Author: Andrew Ng
	  Author URI: http://blog.andrewng.com
	  */
	
	function jquery_lazy_load_headers() {
	  $plugin_path = plugins_url('/', __FILE__);
	  $lazy_url = $plugin_path . 'javascripts/jquery.lazyload.mini.js';
	  $jq_url = 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js';
	  wp_deregister_script('jquery');
	  wp_enqueue_script('jquery', $jq_url, false, '1.4.2');
	  wp_enqueue_script('jquerylazyload', $lazy_url, 'jquery', '1.5.0');
	}
	
	function jquery_lazy_load_ready() {
	  $placeholdergif = plugins_url('images/grey.gif', __FILE__);
	  echo <<<EOF
	<script type="text/javascript">
	jQuery(document).ready(function($){
	  if (navigator.platform == "iPad") return;
	  jQuery("img").lazyload({
	    effect:"fadeIn",
	    placeholder: "$placeholdergif"
	  });
	});
	</script>
	EOF;
	}
	
	  add_action('wp_head', 'jquery_lazy_load_headers', 5);
	  add_action('wp_head', 'jquery_lazy_load_ready', 12);
	?>

[bryan-hadaway 3]

Hmmm, one of the developers might be able to help more in depth with PHP, but for now let's get a live link so that we can see exactly what you're trying to do live. Thanks, Bryan

[jimcamut 0]

Here's a good example http://jimcamut.com/ You will notice the images only load when you scroll because of the plugin. However when I have a regular .jpg or .gif or picture file for my header, then my header won't show up unless I scroll up or scroll down. This is why I have a .swf file. That't the lazy load feature. It's nice for everything below my header and below my feature slides. I can just do away with the plugin, but it would be really nice to have if its possible to make it work. (I have .swf files for my feature slides on my homepage too - for avoiding the lazy load.)

[jimcamut 0]

sorry... jimcamut.com/blog That's what I meant.

[bryan-hadaway 3]

Hmm, I'm seeing no reason why you should be using Flash at all. I imagine what you did is hide/delete/alter the original header and then you had to manually add this swf header directly into header.php or the plugin you mentioned. I recommend, getting rid of the swf, plugin, return the header to it's original state, upload a normal header graphic via the theme options, then we can further customize from there if need be. In the long run it'll be better to do this right. Thanks, Bryan

[jimcamut 0]

You're right about that - I altered the original header file so I could put in the flash. It's probably easier just to stick with the original coding and get rid of the plugin like you suggest. I really appreciate your help. It's awesome having a support team like this. Thanks!

[bryan-hadaway 3]

Okay, just let me know if you need help tidying it up after you correct it. Thanks, Bryan

[jimcamut 0]

Will do, thanks!