WebKit is to include the getElementsByClassName function nativly which is now part of the HTML 5 specification.According to the WebKit blog the native function is blindingly fast. In fact according to WebKits own benchmarks testing the native function against prototype.js’s shows that the native version is 8000% faster.
Found this very cool script today Reflection.js that will create those funky image reflections that you see on the Apple site. Just download and install this JavaScript into the head section of your web page:
<script type="text/JavaScript" src="reflection.js"></script>
To use just add class=”reflect” to your image tags:
<img src="myimage.jpg" class=”reflect” />
Try the demo page where you can change the opacity, reflection height, scale, and background colours.
After watching Apple’s Mac OS 10.5 (Leopard) videos on the Apple site I loved the new look desktop. The desktop was free of all icons and looked beautiful. So after receiving my copy of Leopard through the post I quickly installed it and noticed that once installed all the disk icons still appeared on the desktop.It turns out the you can turn the icons off, just open a Finder window and select ‘Preferences’ from the ‘File’ menu. You can the unselect various item to show on your desktop as shown below.
But then I thought to myself wouldn’t be great if I could have a stack for all my Volumes (Mounted Disks) as they are no longer being shown on my desktop. This should be as easy as dragging a ‘Volumes’ folder onto my Dock. Well it was not quite that easy, as I could not find a ‘Volumes’ folder that contains all my mounted drives. It turns out there is such a folder but it is hidden in the Finder. So you probably asking did I manage to do it? Yes! To start you need to open a Finder window if you have not already got one open, and select ‘Go to Folder…’ from the ‘Go’ menu . You will then be dislayed with a dialog as shown below:
Type ‘/Volumes/’ in the input box and hit enter or click ‘Go’. This will display the hidden ‘Volumes’ folder in the Finder. Now all you need to do now is drag the ‘Volumes’ icon from the title bar area of the Finder window to the dock, see below:
Now you will have a Volumes stack that will always show you what devices are connected and leaves your desktop free from Volume icons.
Safari seems to have a bug when it comes to swapping image sources using JavaScript. It seems that when swapping images, Safari will stretch the new image to the dimensions of the previous image.
This is a serious issue if you are building a cross-browser JavaScript image gallery. But there is hope, there are a couple of workarounds.
Workaround 1:
Load a blank or invisible image with the height and width of 1 pixel just before you load your replacement image.
Workaround 2:
Before you change the image source set the images style.display to ‘none’, swap the image src and then set the image back to style.display = ‘block’
Here’s an example of a basic image swap function with the Safari bug fix:
function swapImage() {
var imgElm = document.getElementById('preview');
imgElm.style.display = 'none';
imgElm.src = newImgSrc;
imgElm.style.display = 'block';
}
<img rc="firstImage.jpg" alt="image preview" id="preview" />
I’m currently developing a CMS (Content Management System) at work and needed a way to disable text selection on certain elements. I was aware of the Mozilla proprietary css property ‘-moz-user-select’ which takes the value ‘none’ to disable text but this is hardly a cross-browser solution. I did a quick Google, and found the following JavaScript function at Ajax Cookbook which attempts to disable text selection for all modern browsers:
function disableSelection(element) {
element.onselectstart = function() {
return false;
};
element.unselectable = "on";
element.style.MozUserSelect = "none";
element.style.cursor = "default";
}
I found a very interesting article today at ExtremeTech about what the author thinks is the worst thing about Macs. I have to agree on most of the points in this article, but I don’t want to spoil it so if you have five minutes go read it yourself.
I’m currently developing a JavaScript picture gallery widget / web service and needed a way to access GET parameters that I’ve passed via one page to another. This is simple in PHP as you can just access the $_GET super global array. Well I did a bit of searching on the internet and found a snippet of code to achieve the same thing in JavaScript.
var $_GET = [];
var vars_area = location.search.substring(1);
if(vars_area.length > 2)
{
var get_sets = vars_area.split('&');
for(i = 0, k = get_sets.length; i < k; i++)
{
var parts = get_sets[i].split('=');
$_GET[unescape(parts[0])] = unescape(parts[1]);
}
}
Stick the above code in the head section of your page (within script tags) or at the top of an external JavaScript file. You’ll then have a very useful $_GET array which contains all your GET params and their associated values.
I know that my blog posts so far have been very Mac orientated, so not to break with tradition here’s another Mac related post. A colleague at work who’s a web/graphic designer gave me a link today to very neat program. This program shows a floating preview of incoming mail so that you can determine whether the message requires your immediate attention.
Mail.appetizer is a plug-in for Apple’s Mail and the current version is a beta, but so far a very stable one. There is also a panther version available.
I decided that I needed to change the default search provider in Safari from Google-US to Google-UK. I thought that this would be a five second trip to Safari preferences, how wrong was I.
For some strange unknown reason Apple has decided to hard code the search provider (Google US) into the Safari application itself. I found various guides on the internet on how to change the default search provider, but they all required use of the Terminal and the not very easy to use editor Vi. Not forgetting that if you make any mistake when editing, it will render Safari completely useless.
After almost giving up I did one last search on Google and came across an excellent Safari plug-in AcidSearch. This plug-in not only lets you change the default search provider in Safari, it also lets setup multiple search providers which you can search on via a handy drop-down menu.
One of the things that you’ve been able to do in IE on the PC for years is run multiple versions along side each other on the same machine. But Mac users wanting to do this with Safari have been out of luck, that is until now.
Today I stumbled upon Multi-Safari which claims to work round this problem. You have to install special packaged versions of Safari which can be download from the site. Each version contains the relevant version of WebKit and the Safari web browser. Installing these special versions of Safari do not overwrite the main WebKit, so you can safely install these without fear of damaging the main Safari installation.