This is probably a massively obvious code snippet, but one that its exclusion has annoyed me for a long time now.

The admin bar in wordpress, whilst helpful, it is a little intrusive on your layout, especially when using a number of absolutely position elements. When you have the admin bar enabled, it *kindly* adds 28px to the top of the page to allow room for it. As said, this can sometime knock out the alignment of your absolutely positioned elements.

In the past I’ve added a couple of lines to my css, to counteract the added margin:

html { margin-top: 0px !important;}
* html body { margin-top: 0px !important;}

However, this will then be present in the css, even when the user isn’t logged in.

So a better method is to use the is_user_logged_in() function – <a href=”http://codex.wordpress.org/Function_Reference/is_user_logged_in”>read more</a>.

I thought best to also put the code into the footer, out the way and also as it is later in the markup, it will have higher importance to that of the other code.

So here’s the code to pop in the footer:

<?php if ( is_user_logged_in() ) { ?>
<style type="text/css" media="screen">
html { margin-top: 0px !important; }
* html body { margin-top: 0px !important; }
</style>
<?php } ?>

And that’s it…

I created some extra features for kupu a while back for work. In a nut shell, when the user click a button, the function places some dummy content where the carat is placed in an iframe, then performs some wizardry then replaces the dummy content with the out put of the wizardry, say a back to top link for example.

This worked fine in the obvious browsers (FF, Chrome, Safari, etc.) and also in IE 6 and 7! The business is in the process of upgrading us to Windows 7, thus adding another layer of fail IE8. It was drawn to my attention that the extra features id created, didn’t work in IE8, GREAT! So i started my line of enquiries…

My first thoughts were that I wasn’t declaring my variables with var whatEver = x, maybe this was causing the errors? Turns out this wasn’t the issue as I added var, wherever i was creating variables, and the features still failed in IE8.

I started to mess around with the code in jsfiddle, trying to work out what the problem was. I noticed that when I was clicking a button in IE8, the focus on the element is wished to change, was lost far quicker than it was in the other *working* browsers. I decided to go down this route.

It turns out that focus is triggered before you .click() function has started. So if your function relies on a specific element having focus, when you click the button, it will lose it before the function is ran. The way around this is to use .mousedown() instead of .click(). Using this method, your element still has focus when the function is ran.

eg:

Try these fiddles out in IE8:

using .click() - http://jsfiddle.net/nXGn9/

$(document).ready(function() { 
    document.getElementById("editor").contentWindow. document.designMode="on";
    $("#imabutton").clcik(loadBackToTop);
    function loadBackToTop(){
        if ($("#editor").is(":focus")) {
            alert('you got it!');
        }
    }
});

using .mousedown() - http://jsfiddle.net/nXGn9/1/

$(document).ready(function() { 
    document.getElementById("editor").contentWindow. document.designMode="on";
    $("#imabutton").mousedown(loadBackToTop);
    function loadBackToTop(){
        if ($("#editor").is(":focus")) {
            alert('you got it!');
        }
    }
});

You see how using .mousedown() differs to .click()? Hope this helps you out, leave a comment if it did/didn’t