Tag: Imported Post

Originally posted somewhere else (ex. a blog I don’t use anymore, or a social networking site) and moved here sometime later. Usually keeping the original posting date.

Posted on
by

Since I’ve been using Opera a lot more than usual since Opera 9 Preview 2 came out, I’ve repeatedly run into the canonical reason that sharing one button for stop/refresh is a bad idea: Reaction time.

When a button changes in response to your own actions, it’s easy to adjust. When a button changes in response to something over which you have no control, there’s a possibility that it may change between the time your brain tells your finger to click on the mouse button and the time it presses down, registering the click with the computer.

Case in point: A web page is loading slowly. You’ve already seen the part you’re looking for, and you don’t need the rest of the images, or the rest of the 587 comments on the blog post. Maybe all you needed to do was confirm you had the right site, and you need to copy the URL. So you go to hit Stop. The web page finishes loading before your finger finishes clicking, the button changes to Reload… and the browser starts reloading the entire slow page from byte one.

I’ve done this at least four times in the past week.

The bad news: I can’t find separate stop/reload buttons anywhere in Opera’s button collection. The closest I could find seem to apply only to panels, not to browser views.

The good news: The Custom Buttons page at NonTroppo.org has them!

Once I get these on all the computers where I normally use Opera, accidental reloads should be a thing of the past!

*This post originally appeared on Confessions of a Web Developer, my blog at the My Opera community.

Posted on
by

Posting an Opera button on your website or blog is a great way to encourage people to try out the browser — but what if the visitor already uses Opera? It shows solidarity, but what if you could show them something else, something that is new to them?

You might want to replace your regular Opera banner with an ad for Opera Mini. Or show them another graphic of your own design. Or maybe not even a graphic, maybe post some sort of message, like “Opera spoken here!” or “Welcome, Opera visitors!”

It’s relatively simple to do this in PHP, or ASP, or some other server-side script…but sometimes you have to stick with static HTML. Well, client-side JavaScript can replace chunks of your page, and here’s how to do it.

1. Put the following script in a file called operalinks.js:

function replaceOperaLink(linkID) {

if(linkNode=document.getElementById(linkID)) {

if ( 0 <= navigator.userAgent.indexOf('Opera') ) {

var newButton=document.createElement('span');

newButton.innerHTML = '<a href="http://www.opera.com/">Glad to see you're using Opera!</a>';

var parentNode=linkNode.parentNode;

parentNode.replaceChild(newButton,linkNode);

}

}

}

For the innerHTML section, you can plug in a new link and banner, or a special message, or anything you want. (Just make sure that you put a backslash () in front of any apostrophes you use.)

2. Put a unique ID in the tag for your regular Opera button. Use the outermost tag that you want to replace. For example, let’s start it off with this:

<a id="OpLink" href="http://www.opera.com">Download Opera!</a>

3. Load the script in your document’s <head> section:

<script type="text/javascript" src="operalinks.js">

4. Call the function in the body onload event using the ID you chose in step 2:

<body onload="replaceOperaLink('OpLink')">

When the page loads, the script will check the visitor’s browser. If it’s Opera, it’ll replace the banner with whatever message you chose in step 1. It’s compatible with both HTML and XHTML, and you don’t need to worry about using <noscript> tags to make sure the banner still shows up for people with JavaScript disabled.

*This post originally appeared on Confessions of a Web Developer, my blog at the My Opera community.

Posted on
by

It’s kind of redundant to post a “Get Firefox!” banner to someone already using Firefox, but it’s useful to show them an upgrade banner if they’re on an old version.  It’s also useful to show Firefox users a banner for Spread Firefox.

This can be done easily with PHP or other server-side scripting languages, but sometimes you have to use static HTML files.  That’s where client-side scripting becomes necessary.  Last month I posted some sample code that used document.write, which doesn’t work with XHTML.  (On top of that, the <noscript> blocks I used ended up causing validation errors because of their location!)

I’ve redone everything with DOM scripting, which will work with either HTML 4 or XHTML 1.0.

1. Put the following in a file called sfxlinks.js:

function replaceFirefoxLink(linkID) {
   if(linkNode=document.getElementById(linkID)) {
      var newLink=document.createElement('a');
      var newImg=document.createElement('img');
      var change=0;
      if ( 0 <= navigator.userAgent.indexOf('Firefox/0') ||
         0 <= navigator.userAgent.indexOf('Firefox/1.0') ) {
         change=1;
         newLink.setAttribute('href','YOUR_UPGRADE_LINK');
         newImg.setAttribute('alt','Upgrade to Firefox 1.5!');
         newImg.setAttribute('title','Upgrade to Firefox 1.5!');
         newImg.setAttribute('src','PATH_TO_BANNER');
      } else if (0 <= navigator.userAgent.indexOf('Firefox')) {
         change=1;
         newLink.setAttribute('href','YOUR_REFERRAL_LINK');
         newImg.setAttribute('alt','Spread Firefox!');
         newImg.setAttribute('title','Spread Firefox!');
         newImg.setAttribute('src','PATH_TO_BANNER');
      }
      if(change) {
         newLink.appendChild(newImg);
         var parentNode=linkNode.parentNode;
         parentNode.replaceChild(newLink,linkNode);
      }
   }
}

2. Use your regular Spread Firefox affiliate link and add a unique ID — let’s use id="FxLink" as an example — to the <a> tag.

3. Load the script in your document’s <head> section:
  <script type="text/javascript" src="sfxlinks.js">

4. Call the function in the body onload event using the ID you chose in step 2:
  <body onload="replaceFirefoxLink('FxLink')">

When the  page loads, the script will check the visitor’s browser to see if it’s an old version of Firefox or a current version of Firefox.  If it’s an old version, it’ll replace your standard button with your upgrade button.  If it’s a current version, it’ll replace it with a Spread Firefox button with your referral link.  Otherwise, it leaves the button alone.

This has a lot of advantages over the old version, including XHTML compatibility, no need for <noscript> blocks, easier validation, and it still degrades gracefully (if JS is unavailable or old, it leaves your normal button in place).

You can see it in action on my website, Flash: Those Who Ride the Lightning.

Originally posted on my Spread Firefox blog.

Posted on
by

Woke up early (well, early for me) so we could get out and hit the polls before work. I was amazed that there was only one person in line ahead of us. Not only that, but there was only one line, not three or four broken up by last name.

Well, it’s a mid-term election. Plus it’s morning, and the last few years we’ve gone in the evening. (There was one year that I voted at lunch, but I had to drive Katie to the poll after work anyway, so it’s easier if we just both go at the same time.) It must have been last year that the line was so long that we got there at 6:30 or 7:00 and didn’t finish until after the polls “closed” — meaning they didn’t let anyone else get into line. (Sensibly, they allowed anyone who was in line by 8:00 to vote.) And there were a lot of people waiting behind us!

Now on to programming for a few hours until Microsoft kicks their patches out the door.

Current Music: Gettin’ Ready Rag (in head)

Posted on
by

The League of Extraordinary Gentlemen, Van Helsing, and Sky Captain and the World of Tomorrow should make a trilogy of sorts.

All three are cheesy action/adventure films that can be quite enjoyable if you watch them with the right attitude. The first two both take characters from classic literature and weave them into a story about Victorian-era secret agents — and both have rooftop battles with Mr. Hyde in Paris. Sky Captain uses tropes from the serials instead of actual characters, but again deals with semi-secret paramilitary organizations that have more advanced technology than the general public. And, like LXG, it finishes at a villain’s secret fortress in the Himalayas.