Posts in the "JavaScript" Category

DOMAssistant 2.5.6 released – AJAX module post method has been fixed (now 2.5.7 version)

I just released DOMAssistant 2.5.5 yesterday, but with the feedback given, some tweaks had to be made to the new AJAX module post method. Instead of updating the same version multiple times, which is wrong, I’ve new made a new minor release where the issues have been taken care of.

So, download the new 2.5.6 version if you’re using DOMAssistant.

Updated January 14th

Just as mentioned by chenghong, I made a mistake and stripped the URL in AJAX GET requests as well. Something I knew, but that’s what I get for preaching about assertions but not applying it properly to my own code. I guess my intuition took overhand for a while. 😉

Anyway, I’ve released a 2.5.7 version of DOMAssistant now (available for download) where everything should be sorted. If you’re using the 2.5.5 or 2.5.6 version, everything should be working fine but the AJAX module’s get and post methods, but please update to make sure you have the latest working version.

I sincerely apologize for any inconvenience this might cause you.

Releasing DOMAssistant 2.0 – Chainability, AJAX module, DOMReady, XPath and more

Updated October 4th 2007

The DOMAssistantCompressed JavaScript file has been updated. My compression approach was a little too effective for the special DOMReady fix for Internet Explorer, so necessary code for optimal performance was unfortunately removed. This has now been addressed, so please download the new version if you use the compressed file.

Updated October 19th 2007

The DOMAssistantCompressed JavaScript file is updated again. I noticed a problem with the elmsByAttribute method in IE where the compression resulted in a wrong reference, returning incorrect results. Download the new version and it will be fine.

Tired but proud, I would like to announce the 2.0 release of DOMAssistant! Refactored code and new features will improve what is already a vital and must-have JavaScript library for me.

Continue reading

FlashReplace – A light-weight JavaScript to insert Flash movies into your web page

Updated April 20th

I’m so used to having a $ method for accessing elements. Nevertheless, the idea is of course that FlashReplace should be stand-alone, so I replaced it with the standard document.getElementById.

Updated April 20th

Although I didn’t encounter any problems with not using an embed element (to have valid HTML code output), it has been strongly recommend that I use it to ensure maximum compatibility. Therefore, it has been added and the file size is now 2.1 kb.

Updated June 3rd

I’ve gotten a few e-mails asking how to add variables to the Flash movie, so here are some options:

The simplest way is to just do it through a querystring. I.e. “movieFileName.swf?testVar=hello”.

Another option is to reference the movie and do it something like this:

document.getElementById("movieName").SetVariable("testVar", "hello");

Ok, everyone and his mother are creating scripts to include Flash into a web page. I wanted to have my own version, but with less and more readable code, so here’s my JavaScript to include flash : FlashReplace.

Continue reading

AJAX Suggestions – a new JavaScript library for you

Updated April 10th with a couple of features per comment suggestions

Ok, I’ve added a couple of features and settings based on the comments I’ve got. The additional settings are:

hideResultsOnDocumentClick
If a click on the document should hide the results list.
itemInsertValueSetFocusToInput
If the focus should be set to the input element, once an item has updated the input element’s value (by initially having the itemInsertValueIntoInputClassName CSS class).
hideResultsWhenInsertValueIsSelected
If the results list should be hidden when the input element’s value is updated.

Another additional feature is that if you use the arrow keys to navigate the results list, arrow up from the first item as well as arrow down from the last, will set the focus back to the input element.

Updated April 11th

Changed the license to a Creative Commons Deed.

Updated April 13th

I got an e-mail with the suggestion to turn off the web browser autocompletion feature of the input element. I think it was a good idea, so I have now added it as a setting:

turnAutoCompleteOff : true

When most people need some kind of intellectual challenge, they do crosswords, sudokus, IQ tests, read up on philosophy or something similar. Me? I write some JavaScript. 🙂

Continue reading

Stop resizing my web browser window!

One of my top annoyances when surfing around is when some “clever” web developer has chosen to use a script that resizes the web browser window to what they think suits their web site. Stop doing that! The size of my web browser window is the one I like, and I very much like to keep it that way.

Do you hate when this happens to? Please sign the petition (or, rather, write a comment) below, to state:

No, we don’t accept you resizing our web browser window anymore! You resize, and we’ll leave your web site forever.

Indentation of code

One thing that I’ve always taken for granted how to do is the indentation of code. Sure, people place characters like { either on the same line as the CSS rule/JavaScript function name, or on the following, and that’s just fine. But what I mean here is how to accomplish the actual indentation.

Continue reading

Is invalid code created through JavaScript ok?

When developing web sites with heavy interactivity, your scripting skills are really put to the test. And, sooner or later, you will be put in a situation where it’s a fine line between following web standards and what’s best from a performance and structure perspective. One question that follows that is: is it ok to apply invalid attributes via script to elements?

Continue reading

DOMAss renamed to DOMAssistant, with added Prototype/jQuery compatibility

After I released DOMAss, I’ve gotten a number of e-mails from people telling me how happy they are with it and how well it compares to other libraries. They only have one problem: the name. What they’re saying is that they can’t use such a name, albeit funny, in production for large web sites and in their customers’ code.

Happy to oblige, the library is now renamed, with added side-by-side compatibility for other JavaScript libraries such as Prototype and jQuery.

Continue reading

DOMAss – The DOM assistant

Updated March 2nd 2007

DOMAss now has a new name, DOMAssistant, and it is also possible to run it side-by-side with other JavaScript libraries such as Prototype and jQuery. For more information, please read: DOMAss renamed to DOMAssistant, with added Prototype/jQuery compatibility.

Updated March 6th 2007

Per Zimmerman made me aware of the fact that I wasn’t as consistent when checking for names and whitespace in the addClass and removeClass as I am in the hasClass method, so this has been fixed to address any potential issues you might have had. Just download the DOMAssistantCSS JavaScript file and you should be good to go. 🙂

Updated April 11th 2007

Changed the license to a Creative Commons Deed.

Updated May 11th 2007

Minor fix for strange behavior in IE when using the addEvent method on the window object. For more information, please see DOMAssistant fix for addEvent method peculiarity in IE.

Updated July 11th 2007

PDF documentation added, kindly created by Michael Frühmann.

Updated September 20th 2007

DOMAssistant 2.0 released!

Updated October 4th 2007

The DOMAssistantCompressed JavaScript file has been updated. My compression approach was a little too effective for the special DOMReady fix for Internet Explorer, so necessary code for optimal performance was unfortunately removed. This has now been addressed, so please download the new version if you use the compressed file.

Updated October 19th 2007

The DOMAssistantCompressed JavaScript file is updated again. I noticed a problem with the elmsByAttribute method in IE where the compression resulted in a wrong reference, returning incorrect results. Download the new version and it will be fine.

When I released my EJ code, while I felt that it contained very useful functions, it didn’t feel properly packaged. Also, I’ve always wanted a proper base to stand on for various DOM interaction, so I didn’t have to start from scratch in every project.

So now, I proudly present DOMAss!

Continue reading

Initial focus to a text field – good or bad?

I think that in (almost) every project I work in, when a web page contains one or more form elements, the most common question is: should we set initial focus to the first element in the form when the page has loaded? Heated debates follow, where people argue very convincingly for their view on it.

However, to me it isn’t an easy black or white-question.

Continue reading

JavaScript frameworks – concept vs. code libraries

Personally, I’ve never been a fan of huge JavaScript libraries, an opinion that was probably clear from what I wrote in my EJ – The only JavaScript library you’ll ever need post. Even if they’re written by very competent web developers, they almost always consist of more functions and methods that are necessary.

However, I’d like to take this opportunity to explain the important difference between the two major types of JavaScript libraries: concept and code libraries.

Continue reading

EJ – The only JavaScript library you’ll ever need

Updated March 2nd 2007

If you like this code, I sincerely recommend that you take a look at the DOMAssistant JavaScript library.

The web is littered with full-blown JavaScript libraries who say they will save your day and make your web development life much easier. You get encouraged to include these “mere 80 kb” libraries that is supposed to be the solution to all your needs, and practically make the web site work by itself. Needless to say, I’m not a big follower of JavaScript libraries,, especially since they almost always include lots of superfluous code, so I thought I’d put together a tiny library with only essential JavaScript functions.

The result of that is EJ – Essential JavaScript.

Continue reading

Want to take your JavaScript knowledge to the next level?

Have you dabbled with JavaScript for a long time but feel that you don’t really know how to get to the next level? Or are you one of the recent converts that till only recently only knew HTML and CSS, but has come to the realization just how cool and funky things you can achieve with JavaScript?

If you want to get really good at JavaScript and definitely move on to the next level, I have something for you to read.

Continue reading

Minor bug fix for GLT

With GLT, a side-effect happened in Firefox when using GLT for any link; the status text simply wasn’t shown in the web browser status field. This issue has now been addressed. Just download the new JavaScript file and things should work fine.

Please let me know if you encounter any problems.

The answers to the “Looking for a good interface developer?” questions

When I wrote Looking for a good interface developer? Here’s what to ask to make sure you’ve got the right person, I wasn’t sure if I should reveal the answers to you or just let you do the research yourselves. However, I came to the conclusion that this web site is really about sharing knowledge, and also that some of you might have some good extra input on my answers.

So, here are some answers and links to more information about the questions:

Continue reading

Accessibility is seldom just up to the interface developer

When developing a web site, amongst the initial questions is what level of accessibility one wants for it and what eventual extra measures are needed to achieve that. Sure, if you’re an experienced interface developer, you naturally write semantic HTML, use alt texts and try to avoid making the web site in question JavaScript dependant, and so on.

But, let me tell you something: you can be the best damned interface developer in the world and then still, in the end, you stand there with an inaccessible web site. What happened?

Continue reading

ELO – Encapsulated Load Object – The ultimate way to handle window load events

Updated April 11th

Changed so it will work fine under https as well in Internet Explorer.

If you like this, you might also be interested in DOMAssistant.

Most people who have worked with JavaScript has cursed the time it takes to apply JavaScript to the document (events, for instance) because you’ve waited for the whole document to load. The problem is that we have relied on the onload event to be triggered and that doesn’t happen until all HTML code and every image and other dependency has loaded. In most cases, we want to have our scripts as soon as the DOM has finished loading and not wait for images and their likes.

Therefore, I have with great interest followed the work of Dean Edwards, together with Matthias Miller and John Resig, and the exciting conclusion they came to in window.onload (again).

I really like the gist of it and the implications it brings, but I wanted to make it more flexible for any number of load events. Therefore I created ELO – Encapsulated Load Object.

Continue reading

GLT – Good-Looking Tooltips

Updated September 27th 2006

Apparently Opera’s claim to support document.all in conjunction with not mimicking it exactly like IE led to some problems in Opera 9 when I use my getElementsByAttribute function. Thanks to Ash Searle who tipped me about this and also explained what the problem was. The code in the JavaScript file to download has been updated.

Also, Harmen asked an interesting question about nested elements with the title attribute. It didn’t work initially, but now I’ve updated the GLT JavaScript file with support for that as well.

Updated September 28th 2006

I did some thinking how to address the faulty technical implementation in IE to display values in the alt attribute as a tooltip, and if I should suppress it on images that have a title attribute as well. I decided to implement a setting for it and then it’s up to you to choose. The GLT JavaScript file now contains one more setting: suppressAltTooltipsInIE : true.

Updated September 29th 2006

I’ve done a very minor change to the event handling to cover up for a bug in IE’s garbage collector (something I hear will be addressed automatically in IE 7). In 99,9% of the cases you won’t notice any difference, but if you use it in a very advanced web site/web application it might make things better and less resource intensive.

Updated October 1st 2006

Just as Chris commented, the script didn’t consider if the custom tooltip would disappear if it was positioned too far to the right. It is now updated with a fix for this.

Updated October 19th 2006

A side-effect happened in Firefox when using GLT for any link; the status text wasn’t shown in the web browser status field. This issue has now been addressed.

Updated October 25th 2006

Just as Jordan Ambra pointed out to me, there were cases when you could mouse out from the element just when the GLT element was shown, and making it stick and not fade out. This was just because of a tiny typo by me in the code, but it has now been fixed.

Updated January 5th 2007

Bob pointed out a typo of me in the code, where the result was that you couldn’t turn off the fading in through the fadeInTitle property. The code has been updated and can be downloaded in the GLT web page.

Updated April 15th 2007

Added an extra check to prevent any eventual error that occurred when hovering a GLT element in the middle of the loading of the page.

As of lately it seems like I’m giving you a new JavaScript library every second day. But don’t worry, I will be fairly busy in the upcoming months so this one is probably the last one for a while. 🙂

Anyway, tooltips in a web page, maybe more commonly known as what will be displayed when using the title attribute on an element, have some shortcomings that I wanted to address.

Continue reading

FaT-Focus at This – advanced JavaScript focusing library

Updated September 29th 2006

I’ve done a very minor change to the event handling to cover up for a bug in IE’s garbage collector (something I hear will be addressed automatically in IE 7). In 99,9% of the cases you won’t notice any difference, but if you use it in a very advanced web site/web application it might make things better and less resource intensive.

When I added the lightbox-like feature to JaS I was talking to my friend Teddy Zetterlund explaining how it worked. His response was:

I know a lot of situations that this could be useful in then.

I agreed with him and have now created the mother of all focusing scripts: FaT – Focus At This! 🙂

Continue reading