You should upgrade to IE7

This text was found when browsing using IE6 – I loved it and wanted to share it with you! Found on Click Forensics

Your are currently browsing this site with Internet Explorer 6. When it was released in August of 2001 Internet Explorer 6 was a cutting edge browser, unfortunately after nearly 8 years the technology behind Internet Explorer 6 has lost its luster. Internet Explorer 6 lacks many powerful features and security enhancements of modern browsers. It is also very poorly lacking in standards compliance which means it’s simply unable to render sites properly without hours of hacks and workarounds.

The last version of Internet Explorer 6 was called Service Pack 1 for Internet Explorer 6 and was released in December of 2004. By continuing to run Internet Explorer 6 you are open to any and all security vulnerabilities discovered since that date. In October of 2006, Microsoft released version 7 of Internet Explorer that, in addition to providing greater safety in navigation, which allows the Internet Explorer browser to identify as’ modern browsers’. Microsoft has launched Internet Explorer 7 as a high-priority update, and is now available to download for free without any certification requirements. As of Feb 12th, 2008 Microsoft is forcing updates to Internet Explorer 6 in order to move people towards the much improved and secure version 7. Please ensure you don’t hamper this process. It’s for your own good!

Download Internet Explorer 7 NOW!

Just another great reason to take the leap away from IE6 — if you can. Is there a version of IE7 for Win2k users?

Tags: ie6, ie7, internet explorer, service pack 1, windows

Debugging with Firebug

Cool article to print out and keep handy on debugging using Firebug. Sadly, I’ve still been using Alert. Call me dinosaur, but it’s worked for me — but I’m trying to change that!

• An in depth look at the future of JavaScript debugging with Firebug
• Firebug Tutorial

This code snippet will help out with browsers that do not have a console function

var console;
if (console == undefined)
    console = new function()
    {
        this.error = function(src) { alert("Error ---\n\n" + src); };
        this.log = noop();
    }

Tags: firebug, firefox

Cross Browser DOM Ready

This is an interesting post about cross browser DOM Ready…

Reinventing the wheel, cross browser DOM ready

There are different techniques to have DOM ready functionality. Some techniques are faster,smarter than the other (or a combination of both). Having it working in various of browser has always been an issue, with HTML 5 they introduced a new event called DOMContentLoaded.

Its a great step to have cross browser DOM ready functionality, but there will always be browsers who doesn’t have this implemented *cough* Internet Explorer *cough* and also the older browsers that some people are still using. So I think it will be safe to say that we can use the DOMContentLoaded completely crossbrowser in the year 2020…Read More

What he’s come up with is very interesting, and for high intensity sites, could be a huge boon.

Tags: firefox, ie6, ie7, safari

Hiding and showing scroll bars with JavaScript

Have you received a requirement that says “We want to see this many elements before you add a scroll bar, we don’t care about the height of the elements, just the number”? If you are using YUI, there is a VERY easy way to handle this! YUI has the following 2 CSS classes which you can add either through javascript or other server side language:

show-scrollbars
hide-scrollbars

The CSS for this is VERY simple:

.hide-scrollbars,.hide-scrollbars * {
    overflow: hidden;
}
.hide-scrollbars select {
    display: none;
}
.show-scrollbars {
    overflow: auto;
}

Now you have scroll bars on command through any language. Using YUI, implement this by addClass, and in Spry, addClassName.

<div class="myBody">
    <ul>
        <li>List of stuff 1</li>
        <li>List of stuff 2</li>
        <li>List of stuff 3</li>
        <li>List of stuff 4</li>
    </ul>
</div>

<script type="text/javascript">
   YAHOO.util.Dom.addClass("myBody","show-scrollbars");
</script>

I’m using the div id “myBody” as text above, but the function also accepts an array of elements, or a single element. You can also wrap addClass into a function that decides when to show or hide the scroll bars.

Tags: firefox, ie6, ie7

Interesting Tools…

So I have been going through my personal sites, trying to see what I need to do to them to make them more available through social bookmarking, other blogs, etc. One of the things I’ve come across is Website Grader. Originally I found the site through Twitter Grader, where I was messing around with the score for my various twitter presences, including my personal one. The Website Grader seemed to be more useful than Twitter Grader. More information on this later when I’m awake and can explain myself

Comments on girl texting excessively in Orlando.

Technology related, sorta. This will be moved to my other blog after work.

The original girl texting excessively story is here

And at this point I must say, when I was a teen in the mid to late 80′s I was chatting on multi-user BBSes before the kids in school knew what a modem, let alone a BBS was – they thought I was weird. This was one of the earliest forms of texting… The coolest part about it was that the kids I was talking to were all affluent, and I was not, but it put me on an even playing field with those kids that I would rather hang out with anyway. Because of my “chatting” habits, the kids at school thought I was “weird”. As it turns out, I was just ahead of my time. That practice helped me see what I could be in my future. Technology is a wonderful thing.

Tags: bbs, chatting, texting

SpryTooltip Placement in Safari

I have had an outstanding bug in my queue for the placement of the SpryTooltip in the Safari browser. It is something that I didn’t have a whole lot of time to invest in, but am finally getting back around to. The fix, so simple it’s astounding, but tracing back to find it was a pain!

The problem:
In the Safari Browser, the tool tip would come up at position 0×0 every single time. In IE and Firefox, the placement was always correct.

The technical problem:

var pos = Spry.Widget.Utils.getBorderBox returns a position object with the coordinates as follows:

pos.x = NaN
pos.y = NaN

At first, I corrected pos.x and pos.y like this:

pos.x = pos.x ? pos.x : 0;
pos.y = pos.y ? pos.y : 0;

Making this change means that any place I use this code I would have to make this correction, which is not really what I’m looking for. But since I know this works, I can go back to getBorderBox and added in some alerts to show me what was really going on. As it turns out, during the traversing of the tags, one of them is returning NaN. So I applied the same type of change here:

while (parent && parent.tagName != ‘BODY’ && parent.tagName != ‘HTML’)
{

/* If parent.scroll(Left|Top) returns NaN, correct to 0 */
if (isNaN(parent.scrollLeft))
parent.scrollLeft = 0;
if (isNaN(parent.scrollTop))
parent.scrollTop = 0;

ret.x -= parent.scrollLeft;
ret.y -= parent.scrollTop;
if (parent.parentNode)
parent = parent.parentNode;
else
parent = null;
}
return ret;

This small change is enough to correct the output, which places the button in the same area as the other browsers – until you scroll.

The last part of the bug to fix is that scrolling does not adjust where the spry tool tip appears in Safari. This may be something that I created while debugging, so I will take the function from the original code, make the minor changes above, validate, and then press on.

Tags: incomplete, safari, spry, SpryToolTip

IE6 – ul Background Color & Border Missing – Fixed!

So the bug I was working on today had to do with the error messages. In Firefox 2 & 3, and IE7, they show up great! Nice yellow background, red text, red border. Nothing fancy, but it definitely sticks out. IE6 gives me the fancy red text, but no background and no border. So off I go on the hunt to figure out why, oh why IE6 has cursed me so.

During my stalking of the interwebs, I came across the adobe forum and someone who had problems with their disc showing up on their <li> elements. Okay says I, how can I use this to my advantage? I read through the comments and the IE6 background bug strikes me like a brick in the forehead. Of course! I’ve solved THAT one before.

So the simple problem boils down to this code:

<span id=”errorMessage”>
   <ul class=”errorMessage”>
      <li>Some Error Message Goes Here</li>
   </ul>
</span>

At first glance, there’s nothing really wrong here. The span has a display:block on it, so it should be great right? Yeah, not so much. Since IE doesn’t expect that a span would ever be used as a block, an explicit width must be set (the background bug solution). So my CSS now looks like this:

span#errorMessage {
display: block;
width: 590px;
}

Now just to be retentive, I’ve also set the <ul> and <li> elements:

ul.errorMessage {
/* added to correct IE6 error styling */
display: block !important;
display: inline;
}
ul.errorMessage {
display: auto !important;
display: block;
}

So now, my IE6 has some specific settings and my FF and IE browsers completely ignore it, thus solving the problem.

Hope this helps!

Other references to this and similar IE bugs:

Missing Backgrounds Bug
The IE7 CSS Hack | iBloom Studios
IE7 Repaint Bug

Tags: browser bug, ie6