Rollovers in iWeb?

Hi, I am a pro retoucher, and have looked around for an easy way to put images in some sort of gallery view, but with rollover effects displaying before images and after images if you roll the mouse over them.
Any idea if iWeb has any plans in ever putting this kind of thing in? (If they haven't already) I see there are HTML snippets one can embed and other fancy workarounds, but my HTML skills are extrmemly limited and can't see how I can integrate that into the galleries functionality as it's all backend coding stuff and I am very much front end designer...
May just have to learn the next best thing - SiteGrinder - as that is Photoshop converted to websites, and with Photoshop being my strength, seems the way to go, but even that requires a lot of time going thru the tutorials...
Just hoped there was a quick way of doing it in iWeb. Any suggestions/insight most welcome

Hover over the image on this page and see if this is what you are looking for:
http://web.me.com/phelpssculpture/Site/Resume.html
If this is what you're looking for, look at Old Toad's Demo's here:
http://web.me.com/toad.hall/Demo_1/Rollover.html
Sincerely,
David

Similar Messages

Slowness of rollovers in iWeb

I finally straightened out how to make rollovers in iWeb and have incorporated them into my site.
http://www.thomasbricker.com/
What I wonder is why rollovers and load times are so slow on a site hosted on the Mobile Me server?
It has always been this way. Seems to still be the case.
Why?
Is it the way that iWeb constructs it's CSS?
I have tried opening an iWeb page in Dreamweaver and it kind of falls apart.
Looks like iWeb uses AP Divs and CSS style sheets.
I just cant figure out how they wrap the structure together.
Is there any way to make an iWeb Mobile Me hosted website any zippier?

MobileMe is definitely slower than the server I use. I have a MobileMe account and test sites on it before optimizing and uploading to Host Excellence.
The Apple server has a restricted bandwidth and therefore limits the number of viewers who can access you site in any given time period which makes it unsuitable for commercial or popular sites.
My hosting company cost is only slightly more than MobileMe and that is more than justified by the extra speed, reliability and available functions such as the ability to run scripts and set up mail forwards for processing forms.
You can't really put a value on good tech support of which MobileMe has almost zero!

Any sign of Rollovers being easier in iWeb '09?

I've read the threads and tried to make rollovers in iWeb 08.
No luck. (I add a snippet of code and get "jack")
Do you think there will be a more direct a method to achieve this basic function in iWeb 09 when it comes out?

Ok Guys,
I finally got it to work!
Way too much work but I know believe it is possible.
Here is my glorious creation:
http://web.me.com/thomasbricker/RolloverTest/RolloverPage.html
Couple of things:
OT, I couldnt get your code to work:
But I could get this code to work:
<script type="text/javascript">
function mouseOver()
document.rollover_one.src ="url of rollover image"
function mouseOut()
document.rollover_one.src ="url of original image"
</script>
Remaining questions:
Does this script only work if all the rollover images have been published to Mobile Me servers?
Can this scripting work on a site that is published to a local folder? (I couldnt get it to work)
Thanks all.
Apple, Please make this whole operation about 100 times easier in future releases.
You use rollovers on your own site so how about working them into your software. : )
(Something tells me you dont create your website using iWeb...)

Create custom navbar w/ rollovers. html snippet Help!

I'm having issues creating a custom nav w/ rollovers in iweb 08 using the html snippet function. I've basically created 5 rollover buttons in PS (they are .png files) side by side to create a top navbar using this code Seen here. http://web.mac.com/catucker/InsideOutside/Rollover.html.
The nav works ok in safari, not at all in IE and very strange in FF. You can go to my website to test yourself. www.tuned2b.com
Is there a better way to achieve this design?
Thanks Community.

In the link the > is missing
+<a href="http://tuned2b.com/pictures.html"+
Correct it and see if it works.
Also, add target="_top", otherwise the linked page is displayed in the button area.
+<a href="http://tuned2b.com/pictures.html" target="_top">+
It's all in the details.

Mouse over / rollover

Can you do mouse overs or rollovers on iWeb? Where you drag the pointer over a link and the links enlarges or highlights.
Sully

You can't create those kind of rollovers IN iWeb. You'd have to create your graphics separately and then edit your files after publishing. iWeb only handles creating graphic rollovers when you use a non web safe font (it gets converted to a set of png's in the default text rollover colors). I've got an example of using text dingbats as rollovers here.
http://web.mac.com/makentosh/iWeb/tipsfromtheiceberg/Blog/416F8EE3-F511-47E8-84F E-80851728F54B.html
I've got another page here (along with a demo file for download) that displays how you can create full color rollovers using the demo version of eZedia QTI. It has it's own drawbacks in that you still have to edit your files after publishing for Windows browsers (to make it look better). Also, for IE specifically, if you use a background graphic, it can't be a .png or worrying things will happen.
http://web.mac.com/makentosh/iWeb/zample/abutton.html

Rollovers work in iweb - but not online

I have created a website in iweb with several hyperlinks just by highlighting a line of text and making it a link. The normal,rollover and visited colors work fine in iweb. However, once I go online to see my page the rollover color does not show when I hover over the link. The problem only exists on one page in a few text boxes but everywhere else the rollovers work. Any ideas on how to fix this problem? Could it have to do with the font?

Thanks so much everyone!!
OT: I will definitely try out a test page. Thx!
Fineligh: Thank you! My boss actually designed it and I've been building most of it out. iWeb is super fun.
Mark: I checked and I did not make the actual boxes a hyperlink - just the client names.
Jeff: Each red client name is fully selected and activated as a hyperlink. But thanks for the advice - sometimes the most simple thing is what sets everything out of whack.
jcerno: In iWeb open your Inspector window (which you can find in your bottom menu bar). Once you open the Window there are icons on the top - click on the arrow. There you can enable images or text as a hyperlink and format the colors/rollovers. If you're not using iWeb than I'm not sure I can be of much help - I'm still new at learning web design. I'm a print person 100%! Good luck.
~ A very perplexed NewPlanet1

IWeb rollovers not working

I've created a site in IWeb, when I publish to my local folder or the web, the rollovers in my navigation bar do not work. They used to work fine, until I added a few more pages to complete my site. My nav bar is a text box with my links inserted as text.
Any suggestions?
Thanks

I see the rollover image that should come up . Since the rollover works locally the issue has to be with the uploading of the site files. How are you uploading the files?
If you're using iWeb try using a 3rd party FTP client like the free Cyberduck to upload the site folder and its index.html file to the server.

How do you hyperlink a rollover to another page from within your iweb site?

Ive made a bunch of rollovers for my iweb navigation bar. If youve created a rollover you know you have to link the images to a image hosting site. here as you would just normally drag and drop a image from your desk top. Because of the way iweb works, if you are using images from a image hosting sit, you can no longer adjust the characteristics of the images i.e. colors, size, and in this case the hyperlink. More specifically you cant change the hyperlink to a page within the iweb site.
So the problem im trying to figure out is how to link the rollover to a page within my iweb site.
now you can actually change the hyperlink of the rollover. however you must do this by adjusting the html within the snippet of the rollover. The problem i found is that iweb doesnt creat sub domains for each page. a entire iweb site with multible pages uses only one domain which is the homepage. so i cant just type a subdomain of another page into the snippet hyperlink because the subdomain doesnt exist.
here is the link to my site. youll notice i did figure out a work around with the "contact us" button but its a huge pain in the butt. i had to create a new domain and a new site then attach the referal index.html to that new domain. todo this for every single button is very difficult.
http://springgardenranch.tk
so i guess the bigger question is, is there a easier way to do this?
perhaps if there was a way to create a subdomains like springgardenranch.tk/contactus withing iweb for each page. but i dont even know if thats possible.
thanks for you help.

Because of the way iweb works, if you are using images from a image hosting sit, you can no longer adjust the characteristics of the images i.e. colors, size, and in this case the hyperlink.
Then use your own images. Then you can create them the way you want.
Here's how I do it :
http://cafenoir.atspace.com/Hover/
And here's the menu in an iWeb page :
http://cafenoir.atspace.com/HNBF/
And here you can learn how to do it. Follow the links to the How-To pages.
http://cafenoir.atspace.com/
You may have to learn HTML. CSS, JavaScript, AJAX, DOM and how iweb creates its webpages.

Links within pages in iWeb

Maybe I'm missing something obvious, but I can't figure out how to create hyperlinks within a page in iWeb. Specifically, I'm trying to write a FAQ, and want to link individual questions listed at the top of the page with their answers further down in the page. Help???

Those are called anchors and not supported by iWeb. Put in a feature request to Apple via http://www.apple.com/feedback/iweb.html.
It can be done with HTML snippets and javascript as Cyclosaurus mentions here: http://widgets.cyclosaurus.com/Anchors/Anchorsfiles/widget0markup.html. But one must be proficient with javascript.
There's a crude workaround with snippets that Peter Berglund describes in his blog: http://web.me.com/petber/iWebtips/iWeb_Tips/Entries/2009/2/22_How_to_use_Anchors_iniWeb.html. This Contents page uses that method for some of it's links - those that are green.
Alternate solutions are with using rollovers like shown in this demo page: Show and Hide Text or using Fancy Zoom shown in the right hand example in this page: FancyZoom You could replace the photo with an image that says Click for Answer" or whatever and have the answer in a jpg file. Both are somewhat low tech solutions.
OT

Can there be an Home/Index page that has links to sub pages in iWeb?

How do you set up a Home page with links to other Photo web pages?
iWeb does a super job creating individual pages full of photos.
But if I want to have a "Directory" page that kicks off the whole site, how do I do that in iWeb?
I want to break up my photo pages into groups like:
Portraiture, Still Life, Life Style etc.

Thanks Will.
Most of my site is created in iWeb. I have been messing around with a iCalendar PHP also, to create a nice calendar for the site.
The Home page is a couple of programs used together.
1. I drew sketches of the little main street.
2. recreated the main Street in a GREAT program called SketchUp. it is the most User Friendly 3D program around and their Website has super tutorials to get you up and running in no time - seriously. Then exported it out to Photoshop as a flattened jpg. (I also did this for the individual buildings for my Banners)
3. In Photoshop, I painted my buildings and gave them some personality.
4. I originally had an Image Map that I created in ImageReady as my Home page, but that doesn't work for iWeb, so I had to use Flash.
5. I made a Flash Movie creating my Buttons and Links and Rollovers (Here you have to Plan some, cause you need to what pages you will have at the end and know the URL to the final pages iWeb produces. It is something like ..sitefolder/sitename/Home.html.
6. Then, I published it as a Quicktime Movie from Flash. You have to Publish as Flash 5 compatible in order to get a quicktime movie. Also, I set up my movie to loop, no controller, and auto play in Flash.
7. Put it on my Home page. (The controller shows up in iWeb, but not in the final Published Site. (I also do not have to manually change the HTML to autoplay "true" and controller "false" on this particular page. I do have to on others though.)
Thanks again Will, for your kind words - I have been working very hard on this site.
Also, don't forget to go to Suzanne's Site 11mystics.com for a lot of information and iWeb tips, tricks, and related links.
Cobe

Viewing iWeb site in OS9 browser - anyone done it successfully?

Hi folks - I made an iWeb site yesterday and although it looks great on my OS X system under Firefox and Safari, my husband running OS 9.2.1 on a G4/733 cannot view the site successfully at all.
In IE 5.0 it loaded up OK but the menu links at the top of the home page didn't work, in Netscape (7, I think) the layout is all over the place, iCab 3 loads the layout OK, the menu links work, but it only briefly flashes the placed images up and then they vanish again. Has anyone managed to view an iWeb site OK using an OS9 browser? Any ideas what the problem is?
Thanks a lot!
Deb.
G4 DP 867 MDD, PB G3/333 Mac OS X (10.3.9)

Thanks for your message Antonio. I did upgrade the version of IE to 5.1.7 but unfortunately the problem with th rollover links still remains. I am using the 'Formal' template and it's the small rollovers generated at the top of each page that don't work under that browser in OS9. I have got around the problem by manually including a second set of hyperlinks lower down on each page, to duplicate the rollovers, but this is a bit of a pain of course. Oh well, may just have to work on my DH to upgrade to OS X!
Thanks for your suggestion.
Deb.

Deleting iWeb Elements from iDisk

I'm sure this question has been posted before; but I couldn't find the answer. Excuse me if I'm being redundant.
I know that when I delete a photo or other element from a page created with iWeb, it will no longer appear on the displayed page ... but will the file be deleted from my iDisk as well? I guess I'm being overly organized perhaps; but I would just like my iDisk to only contain what is actually needed for the website I create. (Also, unneeded files could result in a potential space problem eventually.
I appreciate an answer from anyone who can shed light on my question. Thanks.
iBook G4 Mac OS X (10.4.5)

There are some redundant files like duplicate copies of images and the like that iWeb publishes to your iDisk, but I think this is inherent in the design and html code generation of iWeb and I would not suggest delete files from your iDisk manually that appear to be duplicates to you. In any case, if ever any images are not necessary anymore (like if you delete a page from within iWeb), then iWeb will delete those images automatically from you iDisk.
But every once in a while iWeb messes things up with the files on your iDisk and either keeps extra old files around or doesn't put up new ones for some reason. This causes strange effects like messed up rollovers, phantom images, etc. In this case, a "Publish All to .Mac" usually fixes things....it's like spring cleaning.

IWeb Quicktime Pop Up Window

I am making a site with videos of my work. I want to have one page where I list the titles of the videos. Then, I want the user to click on a title and have the video pop-up in a separate window. I want to be able to control the pop up window size so that it is exactly the same size as the quicktime video.
I have somewhat accomplished this using a HTML code I found online and an HTML Snippet in iWeb. What I don't like, however, is that the HTML Snippet text (the video titles) fade in for some reason. I had this same "fade in" problem with button rollovers using HTML Snippets.
If possible, I'd like to do the same thing that Apple does on their trailer page, where the video opens in the center, without any border, and the rest of the page gets dim.
Thanks,
Chris

Figured out what I wanted using lytebox and a tutorial from iwebunlimited.com. Works great, looks great.

Dynamic Tabs in iWeb

I need help with a personal site that would be my Safari start page. I would like to have layers of HTML snippets that when clicked, would change the layer of the page to make that HTML snippet the top layer, so like dynamic tabs that would not change the page URL, but could change content. Any way to do this?
Thanks in advance!
-Mike

Hi Mike!
Another option (only need to copy/paste some HTML code) would be to create a series of text links to the HTML pages you desire (or they could be small iFrames if you want buttons w/rollovers).
Create an HTML snippet window (i.e. an iFrame) with the appropriate window size, scrolling, name, etc. attributes/values. Let's say you name your iFrame "content".
The overall idea is that your links load other html content into the "content" iFrame. You only need one iFrame for this scenario and it is simple to set-up and maintain.
Publish your web site as per usual (to a folder or Mobile Me).
Next, in a text editor, open up the HTML page with the links and iFrame. Look for the links you created in iWeb (using the Find command will make it easier); "Latest News" is used in this example for the link.
The format will look something like:
<a href="firstpagelink.html" title="firstPageLink">Latest News</a>
Next add the following code to this anchor tag: target="content" (this is the name you used for your iFrame).
So now the code on your page should look like:
<a href="firstpagelink.html" title="firstPageLink" target="content"> Latest News</a>
You would do this with each link, just copy the first target="content" and then paste it in to the other anchor tags.
Once you have set-up your page in iWeb, this post-publish pasting operation goes very quickly.
=============
Drawback: everytime you re-publish the page you need to go through this drill. However it is probably the content in the iFrame that will change the most often. Thoughtful planning/design of the main/link page will hopefully minimize the frequency of changes needed there.
Or use iFrames for your links where the code will not get overwritten - but now we're getting a little trickier because you will have to communicate through the parent document to enable all the "link" iFrames to talk to the "content" iFrame.

Help: Iweb is distorted when viewed by PC users

I'm sure this must be addressed somewhere, but I don't know where. On my iweb blog, I put pictures with text underneath & everything looks fine on my mac. However if I (and others) look at the same pages using my PC, it's not aligned, words and images have shifted, etc.
What's going on here?
http://web.mac.com/alyciawright1/iWeb/The%20Power%20of%20One/Welcome.html
Any help would be great!
Alycia in Virginia

Hello,
It is possible to do rollovers and dropdowns, but unfortunately if you go beyond the beautiful but basic templates, you will have to use html. I have been visiting www.iwebfaq.org and http://web.mac.com/catucker/InsideOutside/iWeb.html quite a bit lately. These sites have walkthroughs and tips on using and going beyond the boundaries of iweb.
I have my own fairly basic website made with iweb if you have some spare time. mymusetellslies.com
It doesn't have any rollovers yet, but I'm not on a tight schedule. As for the problems in explorer or safari, there are some issues that are bugs in those problems and can't be worked around, but I found that many issues were resolved by keeping your boxes neat. For example, if you let a text box flow into another, that seems more likely to cause problems. The fix is simple: resize the boxes so they do not touch and that eliminates many problems.
As for the site map problem and google, that is a pain and problems stem from the navigation bar being java and not just regular links. I would recommend that you recreate the nav bar with text links to solve that problem. The two sites mentioned above go into details about that, and free or cheap programs that will help you build the site.
I personally wish Apple would buy up one of the smaller software companies like sandvox and make iweb pro, like the bought emagic to make logic pro. The ilife and iwork programs are fantastic, but it is a shame that some of the best computers for image work are not supported by the company that makes them in the web design arena, but adobe does have a **** tight lock on a lot of that world.

Rollovers in iWeb?

Similar Messages

Maybe you are looking for