UpdateContent and Swapping images

I have a function built to swap photos of a div:
var imageCount = 0;
setInterval ("updateImage()", 4000 );
function updateImage()
Spry.Effect.DoFade('proImg',{ duration: 700, from: 100, to:
0, finish: function(){
imageCount++;
if ( imageCount > dsPhotos.getRowCount() - 1 )
imageCount = 0;
dsPhotos.setCurrentRowNumber(imageCount);
The photos change every four seconds, this works. The problem
I am having is when I click on a link that uses this function:
function fadeIt(ele,url){
Spry.Effect.DoFade(ele,{ duration: 500, from: 100, to: 0,
finish: function() {
Spry.Utils.updateContent(ele, url, function() {
Spry.Effect.DoFade(ele,{ duration: 500, from: 0, to: 100 });
It replaces the content in the same div that has the rotating
images. But, after four seconds I either get an error message
saying the "proImg" div does not exist or it starts rotating
through the images again.
Is there a better way to do this?
Help!
Thanks!

Here is the body code:
<body onload="updater();">
<div id="container">
<div id="logo"><img src="images/logo.png"
/></div>
<div id="header">
</div>
<div id="menu">
<div class="menubg">
<cfinclude template="menu.cfm">
</div>
</div>
<div id="photos" spry:detailregion="dsPhotos">
<img src="images/site/{picfile}" id="proImg" style="
height: 475px; width: 955px;" title="" />
</div>
<div id="spacer"> </div>
<div id="footer">
<div id="footer_text">

</div>
</div>
</div>
</body>

Similar Messages

Pic Ratio and Swap Image Behaviour

Alrite guys, iv been picking up my web design skills by
developing my own site, and as part of that iv design a gallery
with thumbnails circling a central picture. now iv used the swap
image behaviour to change the thumnail to the central large pic,
unfortunatly the pictures are stretching to the limit of the slice,
is their anyway to fix the ratio of all the pics am using so they
come up in their original size rather than being stretched beyond
the original?
Cheers
Dark

You can do this many ways ways -
1. Don't use swap image - use Show/Hide layer instead. Have
the alternate
image in a hidden layer that is shown when the trigger is
'tickled'. Using
this method you can have images that are any dimension.
2. Use swap image, but remove the dimensions from the
original image's tag,
i.e., change this -
<img name="original" width="150" height="220" ...
to this -
<img name="original" ...
Now when you swap in your offsize image, there is no
predefined size to
change it to. Be aware that this method may well result in an
unpleasant
and undesirable 'rearrangement' of your page layout as it
adjusts to your
new image's dimensions.
3. Pad the smaller image with canvas background color on all
sides so that
all the images *are the same size*.
4. Use a SetTextofLayer behavior to change the image
reference in a layer
positioned so that it will show the desired larger image in
the proper
place.
5. Use the PVII ShowPic extension -
http://www.projectseven.com/
Take your pick....
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Dark7722" <[email protected]> wrote in
message
news:fusck6$of2$[email protected]..
> the issue iv got is not the large images being reduced
(am quite happy to
> crop
> them to fit) but the much smaller images being stretched
from a horizontal
> rectangle to a much large vertical rectangle, their a
different shape from
> the
> central image to begin with
>

Rollover and swap image

Hi, I've created a rollover image that also replaces another
image elsewhere when rolled over. The original rollover does not
return to it's original state on roll out.
Any ideas?
Thanks Chris
<td width="100" height="20"><a
href="philosophy/philosophy.htm" onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('philosophy','','images/navigation/philosophy_over.jpg',1);MM_s wapImage('black_band','','images/navigation/philosophy.jpg',1)"><img
src="images/navigation/philosophy_up.jpg" alt="Philosophy"
name="philosophy" width="100" height="20" border="0"
id="philosophy" /></a></td>

Do not use the automatic restore.
Apply a standard mouseover rollover to image1 to swap in
image1b and to swap
image2 to image2b. Do not enable the restore option. Make the
event
onmouseover.
Apply a second image swap behavior to swap image1 back to
image1, and image2
back to image2. Do not enable the restore option. Make the
event
onmouseout.
I note from your code that you have applied TWO onmouseover
events for the
original swap. Don't do that. Apply the behavior once, but
make that one
application swap both images, i.e., do not swap one image,
click OK, and
apply it again. Swap the first image, then find and select
the second
image, and swap it as well before clicking OK.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Tun Tun bags of fun" <[email protected]>
wrote in message
news:fm7jg5$f4c$[email protected]..
> Hi, I've created a rollover image that also replaces
another image
> elsewhere
> when rolled over. The original rollover does not return
to it's original
> state
> on roll out.
>
> Any ideas?
>
> Thanks Chris
>
> <td width="100" height="20"><a
href="philosophy/philosophy.htm"
> onmouseout="MM_swapImgRestore()"
>
onmouseover="MM_swapImage('philosophy','','images/navigation/philosophy_over.jpg
>
',1);MM_swapImage('black_band','','images/navigation/philosophy.jpg',1)"><img
> src="images/navigation/philosophy_up.jpg"
alt="Philosophy"
> name="philosophy"
> width="100" height="20" border="0" id="philosophy"
/></a></td>
>

Transparent Image and swap image

When I Fix the Trasparent png issue that i have been having
my swap image doesnt work in IE with the png could someone please
help?

link to your page?
Nancy Gill
Adobe Community Expert
Author: Dreamweaver 8 e-book for the DMX Zone
Co-Author: Dreamweaver MX: Instant Troubleshooter (August,
2003)
Technical Editor: DMX 2004: The Complete Reference, DMX 2004:
A Beginner''s
Guide, Mastering Macromedia Contribute
Technical Reviewer: Dynamic Dreamweaver MX/DMX: Advanced PHP
Web Development
"Monarky2000" <[email protected]> wrote in
message
news:ep8631$has$[email protected]..
> When I Fix the Trasparent png issue that i have been
having my swap image
> doesnt work in IE with the png could someone please
help?

Rollovers and swap images not working

since i've upgraded to Dreamweaver CS3 i've not been able to create rollovers.. i need to now
is there a bug? a patch that i need? what is going on? I need help please - been able to make do with flash buttons & text until this job.
Running Mac OS10 - if it helps.. these pages were originally designed in go-live and redesigned since - / i wonder if i'm holding my tongue in the correct position. be gentle with your answers - i'm a graphic designer not a web guru

here is the code to three of the rollovers.. it's tabs
i even thought that if i went ahead and uploaded it might work online.. no such luck
<td height="38" colspan="2" align="center" valign="middle"><spacer type="block" width="1" height="379">
                  <spacer type="block" width="1" height="1">
                  <a href="index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('home','','images/tabs/rimtymehomeover.jpg',1)"><img src="images/tabs/rimtymehome.jpg" alt="Home Page" name="home" width="154" height="38" border="0"></a></td>
            </tr>
            <tr height="38">
              <td height="38" colspan="2" align="center" valign="middle"><a href="malone.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('aboutus','','images/tabs/rimtyme_about_over.jpg',1)"><img src="images/tabs/rimtyme_about.jpg" alt="About us page" name="aboutus" width="154" height="38" border="0"></a></td>
            </tr>
            <tr height="38">
              <td height="38" colspan="2" align="center" valign="middle"><a href="storephotos.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('storegallery','','images/tabs/rimtyme_storephotos.jpg',1)"><im g src="images/tabs/rimtyme_storephotos_over.jpg" alt="Click here for images of each of our locations!" name="storegallery" width="154" height="38" border="0"></a></td>
            </tr>
            <tr height="38">
              <td height="38" colspan="2" align="center" valign="middle"><a href="credit.html"><img src="images/tabs/rimtyme_getstarted.jpg" alt="GETTING STARTED" width="154" height="38" border="0"></a></td>
            </tr>
            <tr height="38">

Have a MacBook Pro running Lion and an IMac running Snow Leopard. Want to Back up both images and restore on opposite machine. Essentially swapping images between hard drives. Is this possible and any "gotcha's" to look for? Thanks

Have a MacBook Pro running Lion (10.7.9) and an IMac running Snow Leopard (10.6.8). Want to Back up both images and restore on opposite machines. Essentially swapping images between hard drives. Is this possible and any "gotcha's" to look for? Thanks

If the MBP came with Lion, it most likely won't boot with SL. Easiest thing to do is create a bootable backup/clone of each to an ext HD, partitioned to hold each on a separate volume, ensure that the original machines can boot with their respective clones, and finally, try booting the other machine with the other clone. Images are useless since you can't boot with them to test them out.

Swap images and hover features

Here is a page to help explain my question better - http://www.leadbitterglass.com/etched_glass_designs/dragdroptest.htm
Hi all, I am trying to create a page where visitors can click one small image (containing a corner of the border) to make a larger image appear somewhere else on the page (the full border design). Once the image has been clicked, I want to be able to allow the user to then hover over other images (flowers and vase image) and these images will then appear 'over' the original clicked image result, showing the border and vase together. I can create the images as transparent gifs so that isn't the hard part. The image below is what I want the final result to look like for the user once the corner border image is clicked and then the vase image is hovered over.
Does anyone know how to create this with dreamweaver? many thanks
PS I am using Dreamweaver cs5.5

Explore "disjointed rollover" or "set text of container" techniques.
You can use a "disjointed rollover" assigning an onclick behavior to the small corner image to trigger the display of the large border-only image and assigning a mouseover behavior to the small vase image to trigger display of the image you posted above.

Swap Images and URLs at the Same Time

I would like to not only to swap images when one rolls over a thum image, but at the same time I would like to have a link swapped in the new image. I am using behaviors to swap multiple images on a page. So to be clear I have several thums that one can roll over. When a thum is rolled over with the mouse a large image is swaped in a different location on the page. I would like to be able to attach a unique link to a URL to each of these new large images when they are swapped.

The link below will take you to a life page. In this example, the changing
text below the large changing image is in fact an image that is swaped out
as one moves the mouse over a thum on the right side of this page. This
changing text image will have an "Add to Cart" button. The button could be
part of the text or perhaps yet another image that changes as one moves
over the thums on the right. Here is where I need the help. As one clicks
on this text image that is changing (or changing button) I would like to
have a link associated with this image that will add the customors choice
of pillows to their cart. Need help with how to associate a unique link to
unique URLs with this changing text image.
Life page: http://katetroyer.com/Pillows.html

Swap Image Behavior with Text

I am trying to figure something out but can't seem to find
it. I'm sure it must be pretty simple, but I'm stumped. Basically,
I have a main image and a few thumbnail images below it. I've
attached the Swap Image behavior to each thumb to change the main
image to a different photo and then changed the onMouseOver to
onClick.
The problem is I want to also have some photo text or caption
below the main image to change. Does anyone know how to do this
with more or less stock DW behaviors? Or if not, how to do it in
the most efficient way possible?
Thanks in advance.
-Bill

You could always embed the caption information in the image,
you know? That
would be the simplest way. Is that possible?
Alternatively you could create a series of stacked
containers, each hidden,
in the location where you want your captions. Then you would
make your
onclick event do both the image swap and the Show/Hide on the
associated
caption container (*and* a hide on all the rest of the
caption containers).
This can be pretty tedious when there are lots of images, and
you are using
only the DW User interface (as opposed to Code view). It will
also take you
into the realm of positioned elements (probably) which can be
troublesome
themselves.
Finally, if this is all too much for you, there are EXCELLENT
alternatives
over at projectseven ($) for doing something like this right
out of the box.
http://www.projectseven.com/
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"captcashew" <[email protected]> wrote in
message
news:[email protected]...
>I am trying to figure something out but can't seem to
find it. I'm sure it
>must
> be pretty simple, but I'm stumped. Basically, I have a
main image and a
> few
> thumbnail images below it. I've attached the Swap Image
behavior to each
> thumb
> to change the main image to a different photo and then
changed the
> onMouseOver
> to onClick.
>
> The problem is I want to also have some photo text or
caption below the
> main
> image to change. Does anyone know how to do this with
more or less stock
> DW
> behaviors? Or if not, how to do it in the most efficient
way possible?
>
> Thanks in advance.
>
> -Bill
>
> <p><img src="images/215-suite-2.jpg" alt="Main
Photo" name="mainImage"
> width="300" height="225" id="mainImage" /></p>
> <p> </p>
> <p> </p>
> <p><img src="images/215-suite-2.jpg"
alt="Thumbnail Photo 1"
> name="thumb1"
> width="100" height="75" id="thumb1"
>
onclick="MM_swapImage('mainImage','','images/215-suite-2.jpg',1)"
/>
> <img src="images/renovations_02-after.jpg"
alt="Thumbnail Photo 2"
> name="thumb2" width="100" height="75" id="thumb2"
>
onclick="MM_swapImage('mainImage','','images/renovations_02-after.jpg',1)"
> />
> <img src="images/renovations_03-after.jpg"
alt="Thumbnail Photo 3"
> name="thumb3" width="100" height="75" id="thumb3"
>
onclick="MM_swapImage('mainImage','','images/renovations_03-after.jpg',1)"
> /></p>
>

"While executing applyBehavior in Swap image.htm, a JavaScript error occurred."

What should be a simple web update is turning into a nightmare. I can't select any of my images to apply onMouseOver Swap Image behaviors, and I keep getting the message above.
Can I just say right now that I hate Dreamweaver CS6 and what it's doing to this project?
Ugh!

Is this a plea for help or a rant?
Javascript Errors in CS4, CS5, CS6 (the whole enchilada of trouble shooting)
http://helpx.adobe.com/dreamweaver/kb/troubleshoot-javascript-errors-dreamweaver-cs4.html
Start with #4, #10 and #12
Nancy O.

Swap images while rolling over popup menu

Hello,
I've been playing with fireworks CS5 for some days now and made a first attempt on a website.
So far, i've made a navigation bar with two states in order to be able to add a simple roll over behavior, e.g. darkening text on rollover. I also have been able to make a dropdown menu (popup) via slices.
Then I decided to swap images when on nav bar headings. So far, so good.
When I did a preview in my browser, it appeared that as soon as I was leaving the nav bar, the image swapped back to the old setting. Perfect.
But when I did a mouse over on one of the dropdown menu's of the navigation bar, the image swapped back as well.. I've been trying, but didnt manage to find out how to fix this.
So, is there anyone here that knows if it is possible, and if so, how to keep images swapped to a second stage as long as the mouse is on the dropdown menu, but swaps back to the original state when leaving the dropdown and/or the navigation bar.
Thanks in advance,

Hi Bryan,
It may be possible to cheat and put this onto the button:
the option that you want is called TITLE.
if you set one of the other parameters (e.g. the label)
to be:
LABEL_TEXT" TITLE="TITLE_TEXT
basically when it adds the text onto the form it will wrap it in "
If it doesn't strip out the " from your text you should get your extra parameter.
it may slip past the portal checking.
I can't test it as I only have WebDB, but I have done something similar with javascript in WebDB.
good luck
Michael

Linking to a swapped image...help

I'm trying to set up a page that has a rightside column of thumbnail images, which, when clickedon opens a larger image in another area. I have done this using swap image. That's all set up, but now I would like to link that larger image to a different page...one with zoomify to show large details. I can't find any way in DW cs4 to do that...the only way the swapped image appears is in Live View and in Vive View the image is unselectable.
Thanks for any help.

<div id="BigPic">
    <p id="box1"><a href="" id="box1link"><img src="http://barbarabaum.com/images/BBis760px.jpg" name="largePix" width="600" height="400" id="largePix" /></a></p>
    </div>
<div id="SmlPix">
<table width="240" border="0" cellpadding="10">
<tr>
    <td width="120" align="center" valign="top"><a href="javascript:;" onclick="MM_swapImage('largePix','','http://barbarabaum.com/images/1.jpg',1);document.getElementById('box1link').href='http://w ww.great-web-sights.com';" ondblclick="MM_swapImgRestore()"><img src="http://barbarabaum.com/images/small/1.jpg" name="cvr" width="100" height="39" border="0" class="pixBox" id="cvr" /></a></td>
    <td width="120" align="center" valign="top"><a href="javascript:;" onclick="MM_swapImage('largePix','','images/2.jpg',1)" ondblclick="MM_swapImgRestore()"><img src="images/small/2 copy.jpg" width="100" height="100" border="0" class="pixBox" /></a></td>
</tr>
I must have done something wrong It's not going to your site. Do you see the problem? Thanks once again.

Two Swap Image Behaviors - Only One Swap Image Restore Works

How come?
I have a button image with a two swap image behaviors applied to it - a rollover for the OVER state and one behavior for a disjointed or "remote" rollover effect.
Both rollover effects work fine, but the disjointed or remote rollover effect does not return the button to it's original state. (I've determined this by removing the second or remote swap image behavior and testing it.)
Why doesn't this work?
All scripts are contained within the HTML page itself; no linked scripts are used.
Thanks!

Page code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">

</script>
<style type="text/css">

</style></head>
<body bgcolor="#FFFFFF" onLoad="MM_preloadImages('images/navigation_2_over-05.gif','images/navigation_2_over-06.g if','images/navigation_2_over-07.gif','images/navigation_over-08.gif','images/navigation_o ver-09.gif','images/navigation_over-10.gif','images/team.gif','images/forms.gif','images/e xport.gif','images/consulting.gif','images/programming.gif','images/contact.gif')">
<table width="792" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
<tr>
<td width="792" height="126" colspan="2">
   <img id="index" src="images/index.gif" width="792" height="126" alt="" /></td>
</tr>
<tr>
<td width="792" height="34" colspan="2">
<table id="Table_01" width="792" height="34" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="34" height="34">
   <img src="images\navigation_2.gif" width="34" height="34" alt="" /></td>
<td width="426" height="34">
   <img src="images\navigation_2-02.gif" width="426" height="34" alt="" /></td>
<td width="105" height="34" id="title">
   <img src="images\blank.gif" alt="" name="blank" width="105" height="34" id="blank" /></td>
<td width="5" height="34">
   <img src="images\navigation_2-04.gif" width="5" height="34" alt="" /></td>
<td width="36" height="34">
   <img src="images\navigation_2-05.gif" alt="" width="36" height="34" id="Image1" onMouseOver="MM_swapImage('Image1','','images/navigation_2_over-05.gif',1);MM_swapImage(' blank','','images/team.gif',1)" onMouseOut="MM_swapImgRestore()" /></td>
<td width="32" height="34">
   <img src="images\navigation_2-06.gif" alt="" width="32" height="34" id="Image2" onMouseOver="MM_swapImage('Image2','','images/navigation_2_over-06.gif',1);MM_swapImage(' blank','','images/forms.gif',1)" onMouseOut="MM_swapImgRestore()" /></td>
<td width="31" height="34">
   <img src="images\navigation_2-07.gif" alt="" width="31" height="34" id="Image3" onMouseOver="MM_swapImage('Image3','','images/navigation_2_over-07.gif',1);MM_swapImage(' blank','','images/export.gif',1)" onMouseOut="MM_swapImgRestore()" /></td>
<td width="33" height="34">
   <img src="images\navigation_2-08.gif" alt="" width="33" height="34" id="Image4" onMouseOver="MM_swapImage('Image4','','images/navigation_over-08.gif',1);MM_swapImage('bl ank','','images/consulting.gif',1)" onMouseOut="MM_swapImgRestore()" /></td>
<td width="31" height="34">
   <img src="images\navigation_2-09.gif" alt="" width="31" height="34" id="Image5" onMouseOver="MM_swapImage('Image5','','images/navigation_over-09.gif',1);MM_swapImage('bl ank','','images/programming.gif',1)" onMouseOut="MM_swapImgRestore()" /></td>
<td width="42" height="34">
   <img src="images\navigation_2-10.gif" alt="" width="42" height="34" id="Image6" onMouseOver="MM_swapImage('Image6','','images/navigation_over-10.gif',1);MM_swapImage('bl ank','','images/contact.gif',1)" onMouseOut="MM_swapImgRestore()" /></td>
<td width="17" height="34">
   <img src="images\navigation_2-11.gif" width="17" height="34" alt="" /></td>
</tr>
</table>
td>
</tr>
<tr>
<td width="410" height="352">
   <img id="index003" src="images/index-03.gif" width="410" height="352" alt="" /></td>
<td width="382" height="352">
   <img id="index004" src="images/index-04.gif" width="382" height="352" alt="" /></td>
</tr>
<tr>
<td width="792" height="29" colspan="2">
   <img id="index005" src="images/index-05.gif" width="792" height="29" alt="" /></td>
</tr>
</table>
</body>
</html>
I can't publish the page and images until later tonight.
Thanks, as always.

Swap Image Looks fine in Firefox, not Safari? Can Javascript be an issue in Safari?

Hi, Im new to web design as you may guess.
I'm trying to put together a website navigation page with several swap image div tags. When I view the page in Firefox it looks fine, after the behavior is applied the page doesn't view at all in safari?
Can anyone please help with this?
I have used a lot of different images and styles (some of which are no longer relevant). Please see below for code -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">

</script>
</head>
<body bgcolor="#FFFFFF" onload="MM_preloadImages('images/CorpLitRollO.png','images/DisplayGraphRollO.png','images /BrandRollOai.png','images/AdvertProRollO.png','images/PackRollO.png','images/ConPhotoRoll O.png')">
<div id="Container">
<div id="IntroText">All Introductory text here<br />
and here<br />
and here.</div>
<div id="FeatherFan">
    <div class="DGOver" id="Display Graphics"> </div>
<img src="images/FeatherFan.png" alt="Feathers Green" name="Feathers" width="800" height="405" hspace="0" vspace="0" id="Feathers" /><img src="images/ConPhotoType.png" alt="Concept Photography" width="164" height="134" class="ConPhoto" id="Image6" onmouseover="MM_swapImage('Image6','','images/ConPhotoRollO.png',1)" onmouseout="MM_swapImgRestore()" /><img src="images/AdvertProType.png" alt="Advertising and Promotions" width="134" height="158" class="AdPromo" id="Image4" onmouseover="MM_swapImage('Image4','','images/AdvertProRollO.png',1)" onmouseout="MM_swapImgRestore()" /></div>
<div class="CorpType" id="CorpLitType" onmouseover="MM_swapImage('Image1','','images/CorpLitRollO.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/CorpLitType.png" alt="Corporate Literature" width="162" height="133" id="Image1" onmouseover="MM_swapImage('Image1','','images/CorpLitRollO.png',1)" onmouseout="MM_swapImgRestore()" /></div>
<div id="CorpRollO"><img src="images/CorpLitRollO.png" alt="corporate literature image" width="162" height="133" /></div>
<div class="DGOver" id="Display Graphics Image"><img src="images/DisplayGraphType.png" alt="Display Graphics" width="154" height="150" id="Image2" onmouseover="MM_swapImage('Image2','','images/DisplayGraphRollO.png',1)" onmouseout="MM_swapImgRestore()" /></div>
<div class="BOver" id="Branding"><img src="images/BrandType.png" alt="Branding" width="137" height="163" id="Image3" onmouseover="MM_swapImage('Image3','','images/BrandRollOai.png',1)" onmouseout="MM_swapImgRestore()" /></div>
<div class="Packaging" id="Packaging"></div>
</div>
<span class="Packaging"><img src="images/PackType.png" alt="Packaging" width="150" height="147" id="Image5" onmouseover="MM_swapImage('Image5','','images/PackRollO.png',1)" onmouseout="MM_swapImgRestore()" /></span>
</body>

becky ss wrote:
Hi, Im new to web design as you may guess.
Welcome to the forum. Please take a few moments to read How to get help quickly. As the advice on that page tells you, please upload your problem page to a website and provide the URL.
Since you're new to to forum, also take a moment to check out the Dreamweaver FAQ and bookmark it so you can find answers to common questions quickly.

Swap Image Thumbnail Borders In IE

I'm creating a web site and am using swap image on a Photo Gallery page. In Internet Explorer the thumbnails in the swap image function show blue borders. In Mozilla Firefox the borders display as light green and changing to rust when I hover over the thumbnail which is what I want.
Is there a work around to solve this problem in IE?
The web site being created is http://www.aspenmountaincabin.com/photos.html
Thank you.

Add the below css styles to your css stylesheet:
#mainContent a img {
border: 2px solid #cccc99;
#mainContent a:hover img {
border: 2px solid #996633;

UpdateContent and Swapping images

Similar Messages

Maybe you are looking for