I am a long-time fan of the Nortel VPN Gateway, which we have at work, and which several of our clients have as well. SSL-VPN technology is just so convenient, you just need a browser and Java, and away you go. The device also supports IPSec connectivity, making it a complete VPN solution.
Until the iPhone came along, with no Java, and support only for Cisco IPSec. So, no VPN to work :(
But what Nortel have done in code release 8.0 for NVG, just released, is include support for L2TP-over-IPSec, which the iPhone does support. And I've just tried it, and it works! Thankyou, Nortel! xoxoxoxoxoxox
I assume that L2TP/IPSec will soon appear in the software for the Contivity series (Nortel VPN Router), if it hasn't already.
Dec 21, 2009
Apr 15, 2009
Firing script with an anchor
Quite often I want an anchor (link) to execute a script, and usually I fall into the trap of trying to use onclick and set href to an empty string or leave it out entirely. However, href is a required attribute and empty string is a valid value which means "link to self", so the correct solution is to put the script into the href attribute, prefixed by "javascript:".
For example, here is an anchor which does the same thing as pressing the browser's Back button:
<a href="javascript:history.back();">Back</a>
Thanks JWhittaker for setting me straight.
For example, here is an anchor which does the same thing as pressing the browser's Back button:
<a href="javascript:history.back();">Back</a>
Thanks JWhittaker for setting me straight.
Apr 9, 2009
Always show a vertical scroll bar
IE always shows a vertical scroll bar for a web page, regardless of whether or not the page is long enough to require one. This is nice for sites with a fixed-width centred layout and a combination of short and long pages, because it means the horizontal position stays exactly the same on every page. Other browsers (Firefox and Chrome at least) don't do this by default.
Finally I've looked up how do this in these other browsers, and discovered that it's actually quite easy. It's not even a hack! Just a CSS rule ...
html {overflow-y: scroll;}
Finally I've looked up how do this in these other browsers, and discovered that it's actually quite easy. It's not even a hack! Just a CSS rule ...
html {overflow-y: scroll;}
Apr 8, 2009
Styling table columns
It seems so natural to want to set colour and alignment on columns of a table. But CSS2.1 does not allow it, it only allows you to set width, visibility, border and background. Hixie explains why. Internet Explorer supports it, but no-one else does.
The workaround is to use CSS selectors as follows:
#table55 td:first-child { text-align:left; } /* col 1 */
#table55 td:first-child+td { text-align:center; } /* col 2 */
#table55 td:first-child+td+td { text-align:right; } /* col 3 */
This works in CSS-compliant browsers including IE7 and above. Thanks to Simon Pieters for this one.
The workaround is to use CSS selectors as follows:
#table55 td:first-child { text-align:left; } /* col 1 */
#table55 td:first-child+td { text-align:center; } /* col 2 */
#table55 td:first-child+td+td { text-align:right; } /* col 3 */
This works in CSS-compliant browsers including IE7 and above. Thanks to Simon Pieters for this one.
Mar 23, 2009
Select border styling in IE
OK, so you can’t directly style the border of the SELECT element in IE, but if you’re using absolute positioning you can wrap it in a DIV, do the positioning and border on the DIV, then set a negative margin on the SELECT itself. I found that negative 1 pixel is right for drop-down selects, and negative 3 pixels is right for selects with a non-default size. Sample code below.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style type="text/css">
#select1,#select2 {position:absolute;left:100px;border:1px solid #666;}
#select1 {top:100px;}
#select2 {top:150px;}
.drop {margin:-1px;}
.nodrop {margin:-3px;}
</style>
</head>
<body>
<div id="select1">
<select class="drop">
<option>One Hundred</option>
<option>Two Hundred</option>
<option>Three Hundred</option>
</select>
</div>
<div id="select2">
<select class="nodrop" size="3">
<option>One Hundred</option>
<option>Two Hundred</option>
<option>Three Hundred</option>
</select>
</div>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style type="text/css">
#select1,#select2 {position:absolute;left:100px;border:1px solid #666;}
#select1 {top:100px;}
#select2 {top:150px;}
.drop {margin:-1px;}
.nodrop {margin:-3px;}
</style>
</head>
<body>
<div id="select1">
<select class="drop">
<option>One Hundred</option>
<option>Two Hundred</option>
<option>Three Hundred</option>
</select>
</div>
<div id="select2">
<select class="nodrop" size="3">
<option>One Hundred</option>
<option>Two Hundred</option>
<option>Three Hundred</option>
</select>
</div>
</body>
</html>
Mar 19, 2009
JavaScript to convert HTML character entity references
To convert all numerical character entities in a string to their character equivalents you can do this:
str.replace(/&#(\d+);/g, function (m, n) { return String.fromCharCode(n); })
str.replace(/&#(\d+);/g, function (m, n) { return String.fromCharCode(n); })
Mar 2, 2009
innerHTML and tables in IE
I have been doing some work on the performance of dynamically-created tables in our web application framework (which only works in IE). I used this QuirksMode performance comparison of innerHTML and the DOM as the basis for my work. Our framework was building the table using DOM methods inside loops, and I rewrote it using the array push/innerHTML method.
Rather than build an HTML string for the entire table, I attempted initially to build a string containing the <TR>s and set table.tBodies[0].innerHTML. This led me to discover that innerHTML is read-only on table elements in IE. How bloody typical. So I had no choice but to do the entire table.
UPDATE: This work turned out to be extremely successful and has made a huge improvement in the performance of our application.
Rather than build an HTML string for the entire table, I attempted initially to build a string containing the <TR>s and set table.tBodies[0].innerHTML. This led me to discover that innerHTML is read-only on table elements in IE. How bloody typical. So I had no choice but to do the entire table.
UPDATE: This work turned out to be extremely successful and has made a huge improvement in the performance of our application.
Password Management
I decided recently that I really needed to improve my password management. Using the same password in all sorts of places just isn't smart. The problem is finding a secure solution which is just as convenient. I tried KeePass for a month or so without really getting excited, but I've just stumbled across LastPass and the penny has dropped. My search is over. And at least one other person agrees with me.
Feb 27, 2009
Google Chrome
The more I use Google Chrome, the more I like it! The main thing is the speed, it absolutely screams compared to IE7 on script-heavy sites like Gmail. I also really like that each tab is a separate process; my machine has limited memory so having these processes means I can see which tabs consume the most memory, and if I close that tab I immediately get the memory back. The combined address/search bar works a treat as well.
When it first came out there were some noticeable bugs, so I kept using Firefox. But now, several updates later, it seems rock solid and I'm doing all my browsing with it.
It will be interesting to see how the market shares pan out. I predict we'll see slow but steady growth, unlike Opera which has never taken off. But it has no chance of overtaking Firefox unless it becomes cross-platform and contains an equivalent extension mechanism.
When it first came out there were some noticeable bugs, so I kept using Firefox. But now, several updates later, it seems rock solid and I'm doing all my browsing with it.
It will be interesting to see how the market shares pan out. I predict we'll see slow but steady growth, unlike Opera which has never taken off. But it has no chance of overtaking Firefox unless it becomes cross-platform and contains an equivalent extension mechanism.
Feb 13, 2009
List margins and padding
I had some trouble today getting my <ul> unordered list to position correctly across browsers. The problem turned out to be simply that the default style sheet in IE is different from the other browsers I tested in its settings for left margin and left padding.
The solution is simply to set values for both left margin AND left padding (use zero if you like) to get your list to position correctly across browsers.
The solution is simply to set values for both left margin AND left padding (use zero if you like) to get your list to position correctly across browsers.
Feb 5, 2009
Jan 7, 2009
IE6 absolute positioning attaching all four sides
By my own and other's observations, the following CSS does not work in IE6.
#div1 {
position: absolute;
left: 50px;
top: 50px;
right: 50px;
bottom: 50px;
}
The only alternative I can think of is to position left and top only, and set width and height in a script which handles an onResize event. Can anyone suggest a less ugly alternative?
#div1 {
position: absolute;
left: 50px;
top: 50px;
right: 50px;
bottom: 50px;
}
The only alternative I can think of is to position left and top only, and set width and height in a script which handles an onResize event. Can anyone suggest a less ugly alternative?
Jan 4, 2009
IE8 support for CSS3
I’m disappointed that IE8 will have almost no CSS3 support, but I can’t say I’m surprised. Still, full CSS2.1 support will be worth having, assuming that Microsoft delivers on its promise.
Subscribe to:
Posts (Atom)