logo

One Must Behave When In Heaven

Seeing as though I'm in developer heaven I thought I'd treat myself and use an IE-only DHTML Behaviour for the first time.

I know, I know. I'm a hypocrite. It was only last week that I commented that using JavaScript during a page's onload event to change its DOM was a hack. For some reason I don't mind Behaviors though. Maybe it's because all the code is stuck in a file you never need to see and they're implemented by way of CSS. Makes it feel less like a hack to me.

The Behaviour I used creates striped tables with a rowover hover effect. It's quite nice actually.

Imagine you want a View to be striped. You can do this now with Domino 6, but not when you want to use your own HTML for the view. It's also a bit plain. What if you want a nice hover-over effect too. You know what I'm going to say don't you - it's best to do it yourself.

Plugging a Behavior in to your site is really easy. Once you've uploaded the file (more on that later and tomorrow) you simply add some CSS, like so:

.rowover{
 behavior: url(rowover_js.htc);
 ro--hover-background : #ddd;
 ro--hover-color : #666;
 ro--selected-background : #999;
 ro--selected-color : white;
 ro--shade-background : #f1f1f1;
 ro--light-background : transparent;
}

Note: The weird-looking CSS properties are used to over-ride the default colours in the .htc file.

Then you add a table (in my case with a HTML View stuck inside it) that starts like this:

<table class="rowover" striped="true">

You can get the tables looking really cool. But that's the easy bit. The tricky bit is getting the .htc files recognised by IE. I'll talk about this tomorrow as it's a lesson worth knowing in its own right.

And before any of you say it, I know using IE-only techniques isn't cool. But, I'm allowing myself to do it just this once. Deep down we all know it's much nicer designing just for IE...

Comments

  1. Check out

    {Link}

    What behaviors are for IE is XBL for Mozilla, the above link combines the two

    • avatar
    • Jake
    • Wed 3 Aug 2005 08:44 AM

    Cool.

  2. You actually can make tables with alternating row colors using your own HTML, even in R5. Just set your view contents to HTML, then make the first column like so:

    "<script language=javascript> document.write(\'<TR BGColor=\' + (" +

    @DocNumber + " % 2 ? \'FFFFD0\' : \'E0FFDF\') + \'><TD>\'); </Script>"

    You can also do mouseover row highlights:

    https://www-10.lotus.com/ldd/46dom.nsf/ShowMyTopicsAllFlatweb/245a0b6c988f8de385256eb0006a4b9d?OpenDocument

    • avatar
    • harkpabst_meliantrop
    • Wed 3 Aug 2005 10:38 AM

    I know, back in R5 this was cool stuff. And then the brilliant irony, that something completely useless in the client (@DocNumber) could finally be used programmatically in the browser, thanks to client-side code (one more thing probably nobody had ever thought of at Iris, when designing the product). But when I look at one document.write() per row nowadays, it makes me shiver.

    • avatar
    • Jake
    • Wed 3 Aug 2005 10:54 AM

    I'm not a fan of one document.write() per row either. Imagine a browser with no JS. They see no view! At least with behaviours the fail "gracefully".

    • avatar
    • Jorge Coelho
    • Wed 3 Aug 2005 11:01 AM

    You could use a modified version of this code here to get it working on multiple browsers. I would just write a JS function to change the row color and then to reset it. Even better just create a class and assign and un-assign the class.

    {Link}

  3. To bad it's IE only. I've found Tigra tables (see:

    {Link} ) a while ago. Since the basic version is free I use it a lot. It allow you to decorate (including mouseover) an existing table at any time. It also would qualify for "code is tucked away in a file you never see". However you need to insert some JS into your design.

    :-) stw

  4. I just saw your post, i'm using this for 2 years now and all my (IE) user are loving it!

    I also use the sort .htc quite a lot

    Keep up the great work!

    P3

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:


About This Page

Written by Jake Howlett on Wed 3 Aug 2005

Share This Page

# ( ) '

Comments

The most recent comments added:

Skip to the comments or add your own.

You can subscribe to an individual RSS feed of comments on this entry.

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »

Elsewhere

Here are the external links posted on the same day.

More links are available in the archive »

More Content