I designed a B&B web site and maintain it. It is a simple site in terms of design but now my client wants pictures that roll over to a larger size from a thumb nail. I think this involves java script which I don’t know but want to learn. The existing web site that she likes as an example is www.unioninn.com
Could someone please point me in the right direction to accomplish this as simply as possible.
The B&B site is www.silaswrobbins.com
Basically she wants a make over and to update to current styles.
TIA for your help (and I really need it!)
Susan
The example site you gave uses Flash for that rollover effect. The whole top section of the home page is all Flash, actually. What you want is called a disjointed rollover or disjointed image rollover. A very basic rollover can be done using only CSS…
http://www.motuweb.com/techstuff/2x_css_rollover_demo.htm
http://meyerweb.com/eric/css/edge/popups/demo2.html
Here’s an example of a rollover with a cross-fade effect using javascript. The page provides the html markup, css and javascript in the bottom sections with brief explanations…as well as links to a zip file with the source files and a link to the commented javascript if you want to take a look.
http://www.websemantics.co.uk/resources/cross-fading_disjointed_image_rollover/
hope that helps. 
Thank you agarcia831 for your response. It looks like it will take a lot of trial and error to understand but I’m up to it! This is a totally new thing for me but I’ve got to get it if I want to keep my customer!
Susan
Here’s a jQuery alternative:
http://herr-schuessler.de/blog/jquery-popeye-1-0-released/
I like jQuery effects because they’re so darn easy to implement, no esoteric JS knowledge (usually) required.
If you don’t like this particular effect, but you’re interested in others:
Susan, this is a little off topic… but if you don’t mind me asking, why did you skip learning JavaScript before becoming a professional web designer? I thought that HTML, CSS and JavaScript are absolutely vital to learn? I ask because I want to be a professional designer. It’s more a long term goal right now. How long did it take you to get to where you are now? Again, sorry for going off topic!
The reason for not learning Java script is that web design is a part time activity for me. My actual occupation is mechanical designer. I also do photo resotration as a part time activity. I retired last August but still maintain and update my existing web sites and if a request for a new one comes along and it is within my capabilities I do it. So far Java script hasn’t been needed. I am complete self taught and I haven’t had time to learn Java script but now I have to so I will. With a full time job there were just so many hours in the day and I need a life too! If web design had been my actual full time job of course I would have learned it. Better late than never.
I am also a non-professional Web designer, and I don’t know how to write JS. I do have a little facility with editing it, mostly by screwing up scripts and trying to figure out how to repair them :). That’s one reason why I like jQuery. It boasts a huge and powerful library of effects, most of which are very easy to implement.
[ot]That’s not necessarily true. It is a wrong asumption that a web designer needs to know about everything… In a team, a web designer simply designs while coders will transfer that visual concept to HTML and CSS.
Then you could have someone for front-end programming (a JavaScript specialist) to add the behaviour and then you can have a team of programmers and developers for server side programming and architecture.
So for some designers, it is not that vital and really depends on how long you’ve been doing this and who you’ve been working with 
That doesn’t mean that a good designer will know nothing about coding… even if he doesn’t code, he’d be better if he understands what others do furthermore the front-end stuff… then they would not create such a complicated layouts and the coders would not cry to death because it is impossible to implement a sophisticated design and make it accessible and SEO friendly and beautiful at the same time… at least, loading in less than 30 seconds 
[/ot]
I’ll go ahead and add another disjointed rollover, Paul’s: http://www.pmob.co.uk/pob/disjointed1.htm
as it’s the one I learned from.
I feel that whenever there’s a behaviour that could be done by either CSS or Javascript, do the CSS one first and if a bit of magic is needed on top of that (like fading or timing) then add Js over that, as agarcia mentioned. Otherwise, at least make sure visitors without JS can see some kind of photo somewhere.
I went to your link and it was GREAT! I think of all the replies so far this is the first one I really think I understood in a way that I can use it.
Wonderful resource.
Thanks. The Site Point Forum has helped me so much over the few years that I have been building web site. Thanks all for responding. You are wonderful!
Susan
You can use CSS to create the roll over large image effect. I found the cssplay.com website to be very helpful creating the effect I wanted.
Thanks for the reference to that website. I’ll check it out.
When I went to school they didn’t teach us Java. We were taught HTML and CSS bu that’s it! Basically it was a really cheap college!! For schooling go with trusted sources. Check with your local BBB. I wish I had done a different course but at the time I didn’t know enough about the technical side of things to realize that I was missing out on a whole bunch of really useful knowledge.
Cheers
Lexy
[FONT=“Verdana”]Hi Susan. Thanks for your reply. As others have pointed out, I did not have my information correct. Although, I disagree with one poster that I “assumed” anything. It was something I read by a “Mentor” on Sitepoint. I regret saying what I did, and I hope you or others did not take it the wrong way.
I totally hear you with the full time job situation. It can take hours just making such simple changes! And then those hours pass away and you don’t even like the change you’ve made! That’s why I initially quit the idea of web design years ago. Anyway, good luck… Your design looks very professional. It will be interesting to see it when you get that rollover done. [/FONT]
As others have pointed out, I did not have my information correct. Although, I disagree with one poster that I “assumed” anything. It was something I read by a “Mentor” on Sitepoint. I regret saying what I did, and I hope you or others did not take it the wrong way.
I don’t think it was even that personal… it is kind of a general idea (we all hear it in job ads!) about all this stuff a “web designer” does… I think molona meant that it’s a pretty common general assumption.
Also, I wish I could add some sort of ammendment to my “mentor” thingie… Mentor doesn’t mean we are experts, though usually we are pretty knowledgeable in something but plenty of us roam around to other areas where we know a lot less. You should hear me over in the Javascript area! You’d laugh.
And while I agree with molona that “web dev” is such a broad term and some (many?) people get pretty specialised with it, I actually also think that Javascript is one of the essential parts of front-end development (even though JS, like images and CSS, should only be an enhancement of a page). Pretty much the only reason I’m bothering to learn it is because I’m expected to know it as “front-ender” and it’s a useful skill in this area!
Don’t regret what you said! If you hadn’t asked, then you wouldn’t have heard! And think of the 10-15 other people who aren’t logged in or anything and read this thread wondering the exact same thing as you! They got an answer to it. It’s awesome.
Sitepoint is definitely an awesome forum and I am very grateful that there are so many people willing to help others.
Susan
Susu, I’m one of those who learned most of what I know from SP forums, and from the sites, books, and tutorials the posters recommended. (Those of you yelling, “Yeah, and doesn’t that make us look bad!” shut yer yapppers. :D) I’ve stuck around here for four years because every day I learn something new, I’ve never been treated with anything but kindness and courtesy, and I’m absolutely confident that whatever inane or blindingly obvious question I bring into the forum will be answered with expertise and, again, kindness and courtesy. Not so most design forums, where the veterans can’t wait to lambast the n00b and mock the less knowledgeable. I’m glad to share whatever knowledge and insight I’ve gleaned, and am thankful that SP folks far more knowledgeable and insightful than myself are willing to share as well. So stick around if you’re so inclined, we’re glad to have you aboard.
I for one would recommend learning a bit of JQuery. Once you get your head around the basics, it’s really an amazing library that will enable you to do all kinds of cool things.
I totally agree. This forum is THE BEST!
I’ll try to find a book on jquery. so far lots of people say this is a good way to go. being self taught i rely on books