jump to navigation

Ahhh, Springtime… May 19, 2011

Posted by flutebrarian in Web Design.
Tags: , , ,
add a comment

Ahhh, Springtime. A time when a girl’s thoughts turn to … golf!

I was recently contacted to create a website for a regional women’s golf club. Since I’m not one who has ever hit a golf ball beyond the mini-putt course, I went into student mode and learned all about handicaps, team play, and standing rules.

But even though I know very little about the game, I enjoy the beauty of the lush grass courses on which the game is played. How about rotating pictures of the various clubs in the league? They liked the idea.

I was thinking in terms of a small rotating gallery done with a JavaScript file I had used several times before. No, they’d rather have a full header for the page fading in and out of the various clubs.

Time to search for a new script.

At first I found a php script that randomly changed the background image every time the page was refreshed or reloaded. This was a snap to put in place – download php, create image directory, put all images and php in this directory, point the CSS file to the script and you’re done. You can add and delete images without having to alter any code in the script, CSS, or HTML.

But it didn’t fade in and out. So back to the drawing board and this time a new JavaScript.

This time, I found an image cross fader from slayeroffice.com. Although it wasn’t as straightforward as the php script, it was much more robust and the images fade in and out quite nicely. And changing the setTimeout value from 1000 to 5000 increased the fading time between images from 1 second to 5 seconds so one doesn’t get dizzy from the changing golf course images.

There are two CSS files and one JavaScript file to download. The images to be used are listed one after another in the HTML file where the fading images are to appear. So, there is more maintenance involved if the images are added or deleted.

But the client likes it, and that’s what counts.


Gallery in Progress January 8, 2011

Posted by flutebrarian in Web Design.
Tags: , , ,
add a comment

Progress is being made on the image galleries for artist Steven McCallum’s updated website. Following the detailed tutorial for this technique at “How to Create a Photographic Gallery Using CSS” I have managed to get this far:

Beginning of Painting Gallery

The opening screen of the painting gallery

The thumbnails have moved from the right side of the gallery to the left; the thumbnails are displayed in a scrolling overflow div; the titles and information for the paintings are moved to the top of the large image; and a default image explaining how to view the images has been added to the background of the image viewer.

The next steps include resizing all the files and renaming them to web-friendly formats (no spaces, all lower case).

One final tweak that I will try is to allow clicking on the thumbnails so that one can scroll up and down the screen if the enlarged image is too tall for the screen. This technique was discussed in an online forum on Webdeveloper.com.

Stay tuned!

Starting a MySQL Database January 20, 2010

Posted by flutebrarian in Web Design.
Tags: , , ,
add a comment

Today was one of those “Eureka!” days. Last fall, the library’s web server was replaced. We had a number of web databases set up in Access and ASP using FrontPage. Life was easy, life was good.

When we upgraded, the new server no longer supported FrontPage Server Extensions and all the ASP database connections broke. Life was no longer easy.

The time had come to face the fact that I needed to learn MySQL and PHP and could no longer put it off. I took an online class on the basics of MySQL through eClasses.org and got that part under control. Taking the bull by the horns, I set up the new database on the new server and figured out how to import the nearly 8,200 records.

I’ve been working on piecing together a web form with a PHP script to add new records to the database for the past few days and this afternoon … Ta da! It worked.

I still need to figure out how to create a search form that will find various strings of data. I have a script that will pass the variable and display the results but that’s not real practical for the average user.

The saga continues …