Monday, September 04, 2006

Look and Feel of blog (#4) Look and Feel of blog (#4)

Another great set of enhancements to my blog. That is the problem with being a programmer at heart - you often don't know when to stop. In any case, the most recent enhancements are:
  • Added a "Help" link to the display options. If you click on "Display" on my display option line, you will now jump to a Help page. This is accomplished as expected, by using an Anchor (<A>) tag around the "Display" with its "HREF" parameter being the link to the Help page (located in my static/dummy blog)

  • Added a global display options line at the top of the blog. This allows you to open, close, etc. all the blog entries at once. I accomplished it by:

    • Adding a NAME parameter (NAME="Post-Div") to the DIVision (<DIV>) I had previously added that controls the display of each post. Each post's DIVision also has a unique ID parameter used to set the display mode for that particular post. In both cases, I merely change the CLASS parameter on the <DIV> element. The difference between the two methods is that at the post level, I use the DIV's unique ID to locate (via "getElementById") the <DIV>, and then change just that one DIV's CLASS, whereas I use "getElementsByName" to locate all of the DIVs with this name, and change all the corresponding CLASSes.

    • I define one Javascript function for globally changing each display CLASS, and each of them merely invokes the generic global class change function with the new CLASS name.

    • I added a paragraph (<P>) that includes a "Display All" linked to the Help page mentioned above, plus a Javascript invocation of each of the four global class change functions to the appropriate name (using anchor (<A>) tags with their HREF parameter referencing the Javascript functions: <A HREF="javascript:GlobalPostXxxx()">). I used the same CLASS formatting (with a unique name, of course) for this as I did for displaying the Display options at the bottom of the Full and Chopped displays.

    • I also put a DIVision (<DIV>) around that paragraph (<P>)in order to include a line below the global display options separating that from the first post.

    • That DIVision was then surrounded by <mainorarchivepage> / </mainorarchivepage> so that it would not be displayed when only a single post is displayed.

Labels:

1:49 PM Display: Full / Chopped / Footer

Display: Full / Chopped / None

Display: Full / Footer / None

Display: Chopped / Footer / None