Quirksmode

Quirksmode is a neat little site describing various features and their support across browsers. This is important, in a world of non-standards compliant browsers. For example, I recently discovered in some code of mine that in an event, Opera 8 supports both ‘srcElement’ and ‘target’ properties. In fact, it seems to support both event models. I can see why, but this caused my code (where I set event.target = event.srcElement if event.srcElement existed) to blow up.

Oh, and it neatly describes a problem I found (and had to solve) yesterday with the ‘this’ keyword in event handlers in Internet Explorer. Wish I’d known this before.

Anyway, I like this site, and it is useful.

Quirksmode

Ajax Design Patterns

Ajax Patterns Wiki. Worth a look for those of us playing with ‘Ajax’. Silly name, Ajax, really. What’s next? ‘Achilles’ for the next ‘killer app’?

More on patterns although much of this is just good design – e.g. local cacheing where possible, and indicating the ‘newness’ of information (people like that. A web site can feel ‘dusty’)

Ajax Design Patterns

Finding the offset of a page item

A couple of functions from my friend Jonathan Beckett for finding the x and y offsets of an item on a page. Basically, it works it’s way back up the DOM finding the offset of each parent item. There may be better ways; I haven’t checked that hard.
function get_x(obj){
var xpos = 0;
if (obj.offsetParent){
while (obj.offsetParent){
xpos += obj.offsetLeft;
obj = obj.offsetParent;
}
}
else if (obj.x) xpos += obj.x;
return xpos;
}

function get_y(obj){
var ypos = 0;
if (obj.offsetParent){
while (obj.offsetParent){
ypos += obj.offsetTop;
obj = obj.offsetParent;
}
}
else if (obj.y) ypos += obj.y;
return ypos;
}

Finding the offset of a page item

How to really, really hack people off

Found a bit of a hack for Javascript – namely a way to inundate a user with windows – using MAILTO:

Consider this code:
<script>

var i;
for (i=0; i<5; i++) {
window.location='mailto:example@example.com';
}

</script>
You see what I mean? Worse might be
<script>
var i;
i = window.location;
window.location='mailto:andy@novolocus.com';
window.location = i;
</script>

Recursion is great, huh?

And an example is this link: Click with care

Pop-up blockers don’t seem to catch this one. Yum.

I know some people will say that this is correct functionality – the browsers is doing what we tell it too with the code. However, that’s true of browser pop-up windows – and we have to block them.

I don’t think that Javascript’s Window.location should be allowed to go to a MAILTO:.

How to really, really hack people off

Firefox plugin installer code

If you’re nerdy enough to care, here’s the code to install a new search plugin…

// Firefox plugin installer code

function addEngine(name,ext)
{
if ((typeof window.sidebar == "object") && (typeof
window.sidebar.addSearchEngine == "function"))
{
window.sidebar.addSearchEngine(
"http://www.example.com/searching/"+name+".src",
"http://www.example.com/searching/"+name+"."+ext,
name,
"" );
}
else
{
errorMsg(name,ext,"");
}
}

Firefox plugin installer code

Javascript in the IE Links bar

I discovered this in the course of some work at a customer’s site – you can put Javascript into IE’s links bar!

The links bar is intended to give you buttons to take you to your commonly used websites (although it is nowhere near as good or useful as Firefox’s links bar, which is more like a menu). You press a button, it goes to that page.

However, in HTML in an anchor tag you can specify to Javascript to run, rather than just a page address. Out of interest, I tried doing this with IE’s links buttons, and it worked.

I was looking for a way to get a substring of the URL that the browser was currently at. The URL was of the form:
http://server/instance/app.dll?action=x&id=1234&next=y
and I was trying to get the value of the ‘id’ parameter (1234 in this case).

What I came up with was a URL that I put into a link. The URL was (one one line):
javascript:x=/id=([0-9]+)/i;x.exec(window.location);
window.clipboardData.setData("Text",RegExp.$1);alert(RegExp.$1);
To break it down:
javascript:
specifies that it is javascript code, not just a page address.
x=/id=([0-9]+)/i;
sets up a regular expression to get the ID
x.exec(window.location);
applies the expression to the current location of the browser window.
window.clipboardData.setData("Text",RegExp.$1);
copies this ID to the clipboard.
alert(RegExp.$1);
confirms that this has been done.

And it works! Hard to believe, but it really works! I’m sure that there must be some sort of security issue here – I need to think about how this might be abused, but there should be a way. Will let you know when I think of something…

Javascript in the IE Links bar

Javascript to Copy to clipboard

Apparently you can use Javascript to copy to the system clipboard. Don’t know if this works on non-Windows systems, but certainly, Internet Explorer seems to support it.

I’m sure that there must be a security risk here – but I haven’t really thought about it yet. And certainly, it appears that Mozilla agree that there is a security issue as it works another way, as shown at Krikkit.net. In short, you have to sign your code or drop your security level…

Javascript to Copy to clipboard