Rollover image action difficulties
Hi,
I have created in Dreamweaver nice rollover buttons and
linked them to an iframe. Now i'm trying to figure out if there's a
way how to make the rollover button stay in mouseover state until
another button is clicked (and another iframe content opens).
My code for the rollover image for now looks like this:
<a href="history.htm" target="content"
onmouseout="MM_swapImgRestore()"
onmouseover="MM_swapImage('history21','','vilnis/button1a.gif',1)"><img
src="vilnis/button1.gif" name="history21" width="183" height="111"
border="0" id="history21" />
Any help appreciated!
Remove the automatic restore from each button. Make each
button's click
swap in the desired image on that button and swap out the
button image on
ALL other buttons.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"spahns" <[email protected]> wrote in
message
news:fct762$kub$[email protected]..
> Hi,
>
> I have created in Dreamweaver nice rollover buttons and
linked them to an
> iframe. Now i'm trying to figure out if there's a way
how to make the
> rollover
> button stay in mouseover state until another button is
clicked (and
> another
> iframe content opens).
>
> My code for the rollover image for now looks like this:
>
> <a href="history.htm" target="content"
onmouseout="MM_swapImgRestore()"
>
onmouseover="MM_swapImage('history21','','vilnis/button1a.gif',1)"><img
> src="vilnis/button1.gif" name="history21" width="183"
height="111"
> border="0"
> id="history21" />
>
> Any help appreciated!
>
Similar Messages
-
CP7 Rollover images Show up every OTHER slide
I am using CP7 and I have a number of graphics on slide 1 that I have defined to have a 'rest of project' timing. I have made multiple groups of graphics on slide 1 and I have made them to NOT be 'visible in output' this way, when I need them, I can use advanced actions to hide/show them (by group name) when I need them for subsequent slides. I am using slide 1 for this instead of the master slide because I need to define the stacking of graphics fairly specifically (slide 3 and further have some graphics that need to be in front of some things and behind some other things).
The set up is that I have a smart shape with a graphic and I am using it as a button on slide 1 (NOT visible in output and lasts for rest of project). Overlayed over top of my smart shape/button is a rollover image. The two objects work just like a rollover button you would see on the web. There is an advanced action that opens the group that the button is a part of and a few other graphic groups that I need to make it look good. When you click the button, there is another advanced action that is supposed to hide the group that both of those graphics are in, plus the other graphics that make it look good, and then go to the next slide. There is an advanced action on the next slide OnEnter that shows the what is needed for the beginning of the next slide.
So, here's the problem. When I click my button, everything disappears and goes to the next slide EXCEPT the rollover graphic, which stays on the screen and on top of all other graphics in slide 2. The SAME EXACT advanced action is used on slide 2 to go to slide 3 (with the same exact button because they are all really on slide 1 the whole time and just being made visible or invisible). When I click, I go to slide 3 and the rollover graphic is gone. I click the button again (to go to slide 4) and I go to slide 4 but the rollover graphic is BACK AGAIN!
I know that this is a complicated write-up, and I am going to go start from scratch to see if I can replicate the problem with a stripped down version of the advanced actions in a new file, but I am hoping someone can point me in the right direction about what is going on. I have deleted and re-inserted the rollover image, but it still does the same thing. I have re-coded the advanced action and it still does it. I have copied rollover images that DONT have this weird glitch and it still does it.
Anyone have any ideas?I found a 'workaround' to this problem, but I would still like to know what is going on underneath to make this happen. Since I have all the rollover graphics on the first slide with timing or 'rest of project' I just made an animated button in Flash and imported it as a .swf to replace the rollover image. I changed the smart shape underneath from having the image of the button to being transparent (still have it being used as a button with all the same advanced actions as before). Now the swf handles the rollover and the transparent smart button underneath handles the OnClick action and everything works great.
Not sure what was going on with the rollover images, but at least I was able to get the result I needed. -
Rollover image works on dreamweaver/preview but not on website
Hey everybody so I'm working on a site for my new clothing line and I am frustrated out of my mind right now because everything seemed to work fine until I published the site my biggest problem right now is that the rollover images I'm using do not show on the actual site but they work perfectly on dreamweaver and the browser preview PLEASE I NEED HELP
here's the CSS/HTML (Below)
<!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>Store</title>
<style type="text/css">
#main .container #content p {
body, div, h1, h2, h3, h4, h5, h6, p, ul, img {margin:0px; padding:0px; }
body { font-family: Arial, Helvetica, sans-serif; }
.container {
width: 1000px;
margin: 0 auto;
body {
font-family: Arial, Helvetica, sans-serif;
background: #e4e2e2;
.Header {
background-image: url(images/Doozie-Jank-Website_03.jpg);
background-repeat: repeat-x;
#logo {
background: url(images//images/webheader_08.png) no-repeat;
height:300px;
width: 900px;
#logo h1 {
text-indent: -9999px;
padding-top: 40px;
ul#menu {
list-style: none;
ul#menu li a {
font-size: 35px;
color: #c7c7c7;
text-decoration: none;
ul#menu {
list-style: none;
padding-top: 185px;
ul#menu li {
float: left;
padding-left: 60px;
ul#menu li {
float: left;
padding-left: 10px;
padding-right: 50px;
#view-cart{
position:absolute;
right:650px;
top:305px;
#rollover{
margin:100px 20px;
height: 400px;
width: 400px;
text-indent: 10000px;
overflow: hidden;
background: url(Images/deer-in-headlights-store.gif) top left no-repeat;
display: block;
#rollover:hover{
background-position: bottom left;
float:left;
width:110px;
height:0px;
margin:5px;
#sidebar {
float: right;
#sidebar {
float: right;
margin-left: 100px;
margin-top: -62px;
#footer {
background: url(images/footer.jpg) repeat-x;
padding-top: 20px;
padding-bottom:60px;
margin-top: 40px;
color: #fff;
#footer p {
padding-top: 20px;
padding-bottom:60px;
margin-top: -25px;
margin-bottom: -25px;
color: #fff;
</style>
<body class="Header">
<div id="main">
<div class="container">
<div id="header">
<div id="logo">
<h1>Doozie Jank</h1>
<ul id="menu">
<li><a href="index.html">Blog</a></li>
<li><a href="Store.html">Store</a></li>
<li><a href="About.html">About</a></li>
<li><a href="Contact.html">Contact</a></li>
<li><a href="#">Cart</a></li>
</form>
</ul>
</div>
</div><!--end header -->
<div id="view-cart">
<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_cart">
<input type="hidden" name="business" value="8JUVRPJ32YCFC">
<input type="hidden" name="display" value="1">
<input type="image" src="images/images/button-view-cart_23.png" width="174" height="47" >
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
</div><!--end view-Cart-->
<div id="sidebar">
<ul>
<a href="http://www.facebook.com/home.php#!/pages/Doozie-Jank/137039669686754"><img src="images/Facebook1.png" alt="" width="52" height="54" /></a>
<a href="http://twitter.com/DoozieJank"><img src="images/Twitter1.png" alt="" width="52" height="54" /></a>
</ul>
</div><!--end sidebar-->
<div id="rollover">
<a href="#"></a>
</div><!--end shirts-->
<div id="Buy">
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<table>
<tr><td><input type="hidden" name="on0" value="Sizes">Sizes</td></tr><tr><td><select name="os0">
<option value="Mens-S">Mens-S </option>
<option value="Mens-M">Mens-M </option>
<option value="Mens-L">Mens-L </option>
<option value="Mens-XL">Mens-XL </option>
<option value="Womens-S">Womens-S </option>
<option value="Womens-M">Womens-M </option>
<option value="Womens-L">Womens-L </option>
<option value="Womens-XL">Womens-XL </option>
</select> </td></tr>
</table>
<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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 +9ftudFJDcAOzlVFH86Mhhv-----END PKCS7-----
">
<input type="image"src="images/images/button-view-cart_13.png" width="160" height="43">
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<table>
<tr><td><input type="hidden" name="on0" value="Sizes">Sizes</td></tr><tr><td><select name="os0">
<option value="Men's-S">Men's-S </option>
<option value="Men's-M">Men's-M </option>
<option value="Men's-L">Men's-L </option>
<option value="Men's-XL">Men's-XL </option>
<option value="Women's-S">Women's-S </option>
<option value="Women's-M">Women's-M </option>
<option value="Women's-L">Women's-L </option>
<option value="Women's-XL">Women's-XL </option>
</select> </td></tr>
</table>
<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<table>
<tr><td><input type="hidden" name="on0" value="Sizes">Sizes</td></tr><tr><td><select name="os0">
<option value="Mens-S">Mens-S </option>
<option value="Mens-M">Mens-M </option>
<option value="Mens-L">Mens-L </option>
<option value="Mens-XL">Mens-XL </option>
<option value="Womens-S">Womens-S </option>
<option value="Womens-M">Womens-M </option>
<option value="Womens-L">Womens-L </option>
<option value="Womens-XL">Womens-XL </option>
</select> </td></tr>
</table>
<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----MIIHZwYJKoZIhvcNAQcEoIIHWDCCB1QCAQExggEwMIIBLAIBADCBlDCBjjELMAkGA1UEBhMCVVMxCzA JBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UECxQKb Gl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb20CAQAwDQYJKoZ IhvcNAQEBBQAEgYA2Ark1q/MZdDym/pL5q8HksBbhh5iqXf9XSFGUBz8kBbPu0LNws7WHDlt7oXI5K6E32LGpSB0/2 MDt0yjUHm4qJECrECNnP3/oSCjAlwqUCdZpcNKoAByp89Ky99eUA0tsxiOj+0D38R5SeD9xFMCreOrsPw4wD78/OZx D6WBHVjELMAkGBSsOAwIaBQAwgeQGCSqGSIb3DQEHATAUBggqhkiG9w0DBwQI0oCEjezx30WAgcCSnlZjjBUAslI/r pAIQ1lrHPGr7S18N1n9wsEwIpylhhjFjznjadwwb5S9MHiJsaNy+9P+21Jt3eM4/xNyAjFO8aFvUpDVvfkaUKe4+9u fUz8Q7qknS7XJLUZrh4LB1Rwh7I+k8fKvrdsPLBC7UHGvXzcDBSc8yW+6eteutmfN62zxBJxIf+n6XRpWICX+GOd54 hBDtH1Wj9xEOwoYrY3O9cqFztWUHoF2bL2BRvWp+CjUkCwgjWTcmTsWK0U1Cj+gggOHMIIDgzCCAuygAwIBAgIBADA NBgkqhkiG9w0BAQUFADCBjjELMAkGA1UEBhMCVVMxCzAJBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3M RQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgk qhkiG9w0BCQEWDXJlQHBheXBhbC5jb20wHhcNMDQwMjEzMTAxMzE1WhcNMzUwMjEzMTAxMzE1WjCBjjELMAkGA1UEB hMCVVMxCzAJBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBE GA1UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb20wg Z8wDQYJKoZIhvcNAQEBBQADgY0AMIGJAoGBAMFHTt38RMxLXJyO2SmS+Ndl72T7oKJ4u4uw+6awntALWh03PewmIJu zbALScsTS4sZoS1fKciBGoh11gIfHzylvkdNe/hJl66/RGqrj5rFb08sAABNTzDTiqqNpJeBsYs/c2aiGozptX2Rln BktH+SUNpAajW724Nv2Wvhif6sFAgMBAAGjge4wgeswHQYDVR0OBBYEFJaffLvGbxe9WT9S1wob7BDWZJRrMIG7BgN VHSMEgbMwgbCAFJaffLvGbxe9WT9S1wob7BDWZJRroYGUpIGRMIGOMQswCQYDVQQGEwJVUzELMAkGA1UECBMCQ0ExF jAUBgNVBAcTDU1vdW50YWluIFZpZXcxFDASBgNVBAoTC1BheVBhbCBJbmMuMRMwEQYDVQQLFApsaXZlX2NlcnRzMRE wDwYDVQQDFAhsaXZlX2FwaTEcMBoGCSqGSIb3DQEJARYNcmVAcGF5cGFsLmNvbYIBADAMBgNVHRMEBTADAQH/MA0GC SqGSIb3DQEBBQUAA4GBAIFfOlaagFrl71+jq6OKidbWFSE+Q4FqROvdgIONth+8kSK//Y/4ihuE4Ymvzn5ceE3S/iB SQQMjyvb+s2TWbQYDwcp129OPIbD9epdr4tJOUNiSojw7BHwYRiPh58S1xGlFgHFXwrEBb3dgNbMUa+u4qectsMAXp VHnD9wIyfmHMYIBmjCCAZYCAQEwgZQwgY4xCzAJBgNVBAYTAlVTMQswCQYDVQQIEwJDQTEWMBQGA1UEBxMNTW91bnR haW4gVmlldzEUMBIGA1UEChMLUGF5UGFsIEluYy4xEzARBgNVBAsUCmxpdmVfY2VydHMxETAPBgNVBAMUCGxpdmVfY XBpMRwwGgYJKoZIhvcNAQkBFg1yZUBwYXlwYWwuY29tAgEAMAkGBSsOAwIaBQCgXTAYBgkqhkiG9w0BCQMxCwYJKoZ IhvcNAQcBMBwGCSqGSIb3DQEJBTEPFw0xMDEyMjIyMDEzNDdaMCMGCSqGSIb3DQEJBDEWBBRJKopvfz8XYEgCFRqDK +KA57OA4TANBgkqhkiG9w0BAQEFAASBgBUubN3UKQ+CEoLTZ3qIekfqFStHQyAA9mBr6rmkkX0SEMse9IB6N3oQ6V1 JrPwzwwPgX4gRUobUte8TTcLMtpgSmCFtw6Vycd6ygepjjNO/YNKTbgAIRIQdyGvxzaml9JJf59gJqxTwDOwVNW/G3 hzSw3oItgcbXf9EB/o/qXtb-----END PKCS7-----
">
<input type="image" src="images/images/button-view-cart_19.png" width="197" height="44" />
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
</div><!--end buy-->
<div id="footer">
<div class="container">
<p>Copyright © 2010 Doozie Jank<br />
All Rights Reserved</p>
</div><!--end footer container-->
</div><!--end footer-->
</head>
<body>
</body>
</html>Fix your validation errors first -
http://validator.w3.org/unicorn/check?ucn_uri=dooziejank.com%2FDeer%2520in%2520The%2520Hea dlights.html&ucn_lang=en&ucn_task=conformance#
For example, you have no </head> tag....
And it's a very bad idea to use spaces in your filenames for the web
Deer in The Headlights.html -
Can anyone give me a short, step by step way to
create rollover images with captions. I couldn't manage to get that
done, and when I read the Help screens within the application, it
didn't help either.
In particular, here was the problem: I was in Storyboard with
the slide highlighted that I wanted to add the rollover image and
caption. When I went up to the Insert drop-down menu and clicked on
Rollover Images, there were no images; I was simply taken to My
Documents.
I hope somebody can help. I've spent more than 4 hours trying
make this work. I'm SURE it's some little detail that I've failed
to pay attention to.
THANK YOU!
DeanHi Dean,
The "little detail that (you) failed to pay attention to" is
just that. In order to insert an image, you have to select the
image to insert. Use Windows Explorer (from \\My Documents\) to
navigate to \\My Documents\My Pictures\ or whereever else you keep
the image you wish to insert, and select it. Understand, it is up
to you to provide the image . . . it's not like you are selecting
from Captivate's own image gallery (though that is a cool idea, now
that I think of it - LOL!)
Your question indicates to me there might be some confusion
about what you want. You said you want "rollover images with
captions". There are rollover images which are just images to which
a mouseover action has been applied, and there are rollover
captions which are just normal captions to which a mouseover action
has been applied ... but there are no rollover images
with captions. The only way to have a rollover display a
caption is to create it yourself. And the "step-by-step" for doing
that is totally dependent on which image editor you are using
(Photoshop, Paintshop Pro, Paint, etc.). But the gist of it is
below.
1) Open the image in your image editor - or create it there
2) Expand the canvas to create extra "blank" space on the
image (for the caption)
3) Use the "Text" tool to create your caption text and add it
to that blank space.
4) Save the image - BMP format works very well, but any
format supported by Captivate.
5) Close the image editor
6) Open or switch to Captivate and the slide on which you
want to place it.
7) Select "Insert > Rollover Image"
8) Select the image (with its included caption)
9) Set its attributes and position it on the slide.
Hope this helps. The reason you wont' find this in the "Help"
files is because it is a creative use of images that is not a
supported function of Captivate itself. If you would like to see
future versions of Captivate support the creation of
images-with-captions, the way to do it is to submit it as a feature
request. The form to do that
is
located at this link
Hope this helps. -
I have a weird glitch I can't figure out with one of my rollover images. I am using a smart shape as a button and have placed a rollover image over top of it so the two together will function as a rollover button like on webpages. The 'button' is grouped with two text areas and the group is placed on slide 1 with all four objects in the group defined as NOT visible in output, timed to display for entire project, and forced to be on top so it can function as a 'lightbox' effect with a close button. When I need this 'lightbox' with the text and the 'button' (smart shape button and image rollover), I SHOW the group through an advanced action. Once shown, the button functions as expected, and the button is programmed to go to the next slide. One slide 2, there is an OnEnter Event that hides the lightbox (and button in the group), along with other graphics to reset the slide graphics. The screenshot below is part of the lightbox with the offending button. When I mouseover the black button (smart shape being used as a button with a graphic fill), it swaps to an orange color
OK, so here's the weird part....I can open the lightbox without a problem. My 'button' shows up and the image swaps when the mouse hovers over. Beautiful. It disappears on mouseout. Perfect. I put my mouse over the button again and the image swaps to the over image perfectly again. I click the button and Captivate takes me to slide 2 and all the graphics hide (according to the OnEnter advanced action on slide 2) EXCEPT the rollover graphic. That graphic stays rendered on the screen until I go to the next slide and it gets hidden by the OnEnter advanced action for slide 3 (which is the same exact action as slide 2). The 'Next' Text is a text box with a link defined. The link has the exact same functionality defined as the button...go to the next slide. The screenshot below shows the result if I use the arrow button to go to the next slide. The orange arrow is left over from slide 1, and the black button (in the middle) is from slide 2.
Is there a reason that the mouseover image still renders? Is it because IO have my mouse over the image so it won't recognize the OnEnter Action telling it to disappear or something? I have other buttons with the exact same functionality that work just fine from slide to slide. It's only this one particular button that does it. I have replaced the rollover image, renamed the group (in both the slide and the advanced action), and even tried to create graphics to mask the weird functionality...to no avail.
Anyone out there have a suggestion of what to try? Oh...Using CP7, btw.My concern wasn't with the navbar, but thanks for the headsup.
The problem is that the link in the upper left hand corner, Suzie's Story, is a rollover image but it does not reveal the other image when the cursor goes over it.
<div id="topTabs1">
<div align="center"><a href="http://www.google.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('suzie','','Images/Suzie's Story Tab_light.jpg',1)"><img src="Images/Suzie's Story Tab_black.jpg" alt="suzie" name="suzie" width="75" height="45" border="0" id="suzie" /></a></div>
</div>
#topTabs1 {
width: 75px;
height: 45px;
float: left;
background-color: #ffffff;
padding-left: 0px;
padding-right: 0px -
Place button rollover image on top of external swf
I have a menu that when you click on a button, an external swf is called up. However I would like for the buttons in the Over and Down state to show an image on top of the external swf with a description of what the video is about (Basically when they rollover the button).
The problem is that the image shows behind the external swf. I cannot get it to appear on top of the external swf. I have tried putting the buttons layer on top of the actions layer but that doesn't work.
I have not been using Flash for very long but I need to know if there is ActionScipt that can solve my problem or any other way to solve this issue. Please help. Thank you.This is what appeared now in my Output panel.
Core_K12_Menu CS5.swf Movie Report
Metadata
Bytes Value
387 <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <rdf:Description rdf:about="" xmlns:xmp="http://ns.adobe.com/xap/1.0/"> <xmp:CreatorTool>Adobe Flash Professional CS5</xmp:CreatorTool> <xmp:CreateDate>2010-07-25T19:31:59-07:00</xmp:CreateDate> <xmp:MetadataDate>2010-08-01T18:42:52-07:00</xmp:MetadataDate> <xmp:ModifyDate>2010-08-01T18:42:52-07:00</xmp:ModifyDate> </rdf:Description> <rdf:Description rdf:about="" xmlns:xmpMM="http://ns.adobe.com/xap/1.0/mm/" xmlns:stRef="http://ns.adobe.com/xap/1.0/sType/ResourceRef#"> <xmpMM:InstanceID>xmp.iid:2136C7DCCB9DDF11B1ACFFBB5C2D711F</xmpMM:InstanceID> <xmpMM:DocumentID>xmp.did:2136C7DCCB9DDF11B1ACFFBB5C2D711F</xmpMM:DocumentID> <xmpMM:OriginalDocumentID>xmp.did:423EF45B6198DF1180E5FB9309482BDA</xmpMM:OriginalDocumentID> <xmpMM:DerivedFrom rdf:parseType="Resource"> <stRef:instanceID>xmp.iid:992BC7CBB29DDF11B1ACFFBB5C2D711F</stRef:instanceID> <stRef:documentID>xmp.did:F34D8816A19DDF11ADEA81F4369F4B15</stRef:documentID> <stRef:originalDocumentID>xmp.did:423EF45B6198DF1180E5FB9309482BDA</stRef:originalDocumentID> </xmpMM:DerivedFrom> </rdf:Description> <rdf:Description rdf:about="" xmlns:dc="http://purl.org/dc/elements/1.1/"> <dc:format>application/x-shockwave-flash</dc:format> </rdf:Description> </rdf:RDF>
Frame # Frame Bytes Total Bytes Scene
1 295119 295119 Scene 1 (AS 3.0 Classes Export Frame)
Scene Shape Bytes Text Bytes ActionScript Bytes
Scene 1 0 0 1133
Symbol Shape Bytes Text Bytes ActionScript Bytes
ActiveMC 40 0 0
IntroModule 0 0 0
Module 1 Rollover 0 0 0
Module1 0 0 0
Module2 0 0 0
Module3 0 0 0
Module4 0 0 0
Module5 0 0 0
Module6 0 0 0
Module7 0 0 0
Module8 0 0 0
Module9 0 0 0
Module10 0 0 0
Module11 0 0 0
Module12 0 0 0
Module13 0 0 0
Module14 0 0 0
Module15 0 0 0
Module16 0 0 0
Module17 0 0 0
Module19 0 0 0
Module20 0 0 0
Module21 0 0 0
next_btn 0 0 0
replay_btn 0 0 0
Rollover 0 0 0
Rollover Image.psd 0 0 0
Symbol 18 0 0 0
Title.psd 0 0 0
ActionScript Bytes Location
1133 Scene 1:Frame 1
Bitmap Compressed Original Compression
Layer 1 3675 88264 JPEG Quality=80
Layer 1 3287 63936 JPEG Quality=80
Layer 1 1205 19668 JPEG Quality=80
Introduction-Up.jpg 6357 23200 Imported JPEG=102
Introduction-Down.jpg 5862 23200 Imported JPEG=102
Module 1-Up.jpg 5957 23200 Imported JPEG=102
Module 1-Down.jpg 5548 23200 Imported JPEG=102
Login Page and Tech Check Topics Covered - Introduction to A 4791 288576 JPEG Quality=80
Module 2-Up.jpg 6030 23200 Imported JPEG=102
Module 2-Down.jpg 5607 23200 Imported JPEG=102
Module 3-Up.jpg 6035 23200 Imported JPEG=102
Module 3-Down.jpg 5556 23200 Imported JPEG=102
Module 4-Up.jpg 5997 23200 Imported JPEG=102
Module 4-Down.jpg 5584 23200 Imported JPEG=102
Module 5-Up.jpg 6031 23200 Imported JPEG=102
Module 5-Down.jpg 5607 23200 Imported JPEG=102
Module 6-Up.jpg 6030 23200 Imported JPEG=102
Module 6-Down.jpg 5610 23200 Imported JPEG=102
Module 7-Up.jpg 5986 23200 Imported JPEG=102
Module 7-Down.jpg 5575 23200 Imported JPEG=102
Module 8-Up.jpg 6035 23200 Imported JPEG=102
Module 8-Down.jpg 5615 23200 Imported JPEG=102
Module 9-Up.jpg 6031 23200 Imported JPEG=102
Module 9-Down.jpg 5611 23200 Imported JPEG=102
Module 10-Up.jpg 6192 23200 Imported JPEG=102
Module 10-Down.jpg 5707 23200 Imported JPEG=102
Module 11-Up.jpg 6119 23200 Imported JPEG=102
Module 11-Down.jpg 5662 23200 Imported JPEG=102
Module 12-Up.jpg 6189 23200 Imported JPEG=102
Module 12-Down.jpg 5709 23200 Imported JPEG=102
Module 13-Up.jpg 6194 23200 Imported JPEG=102
Module 13-Down.jpg 5710 23200 Imported JPEG=102
Module 14-Up.jpg 6193 23200 Imported JPEG=102
Module 14-Down.jpg 5705 23200 Imported JPEG=102
Module 15-Up.jpg 6197 23200 Imported JPEG=102
Module 15-Down.jpg 5713 23200 Imported JPEG=102
Module 16-Up.jpg 6202 23200 Imported JPEG=102
Module 16-Down.jpg 5716 23200 Imported JPEG=102
Module 17-Up.jpg 6155 23200 Imported JPEG=102
Module 17-Down.jpg 5684 23200 Imported JPEG=102
Module 18-Up.jpg 6204 23200 Imported JPEG=102
Module 18-Down.jpg 5719 23200 Imported JPEG=102
Module 19-Up.jpg 6198 23200 Imported JPEG=102
Module 19-Down.jpg 5713 23200 Imported JPEG=102
Module 20-Up.jpg 6205 23200 Imported JPEG=102
Module 20-Down.jpg 5723 23200 Imported JPEG=102
Module 21-Up.jpg 6150 23200 Imported JPEG=102
Module 21-Down.jpg 5685 23200 Imported JPEG=102
Replay Button.jpg 5365 18240 Imported JPEG=102
Replay Button Down.jpg 4803 18240 Imported JPEG=102
Next Button.jpg 4965 18240 Imported JPEG=102
Next Button Down.jpg 4684 18240 Imported JPEG=102 -
Using fireworks rollover images in flash
I'm trying to create the best way to use a series of fireworks rollover images in Flash and was hoping some flash gurus had ideas. I'm creating a photo album of sorts in flash, except when you click to bring up a photo, you can mouse over certain parts and have the text labels on the images change. I have a lot of images and therefore a lot of rollovers. I have a central layer called 'content' where the images get displayed. What is the best way to include these rollovers in my flash documnet?
Well guess what, it doesn't:
http://www.ctc-belgium.be/TEMP/test.cfm
This is the code (images are in the same subfolder):
<!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>
</head>
<body>
<cfform format="flash" action="../upload.cfm"
style="background-image:ero1.jpg;
background-repeat:no-repeat; background-position:top right;
text-align:center; border:1 solid black;">
<img src="ero2.jpg" />
</cfform>
</body>
</html> -
How do I show multiple rollover images on a page inserted dynamically (pulled out of a sql database
How do I show multiple rollover images on a page inserted dynamically (pulled out of a sql database table) using Dreamweaver’s Repeat Region. Example: I have different products each one associated (through their productID) with two images (one that’s showing in the page and one for the rollover effect) that are pulled from a database using Dreamweaver’s Recordset. So I want to end up with a page containing row after row of images(one for every product).When moused over each image will reveal the second (rollover) image for the same product which in turn can be a link(the image itself ) that when clicked leads to a detailed page with more information about the product the image is associated with. To show row after row with images for the different products in the database table I am using Dreamweaver’s Insert Rollover Image command and then the Repeat Region – I have no problem to complete the steps, to insert the image and the rollover one at once and set the paths so they are pulled dynamically depending on the productID they are associated with .I have also no problem to apply the Repeat Region so not only the first image associated with the first product in the table is shown but all of them-a routine and standard procedure when using the Repeat Region to dynamically generate and display multiple rows of data. However, when I preview the page the rollover effect is lost –the images are shown but when moused over the second image does not show. The problem is caused when the Repeat Region is applied-once again I am allowed to apply it but the rollover stops working, a kind of interference. ANY SOLLUTION PLEASE, ANY WORK AROUND.
I gotta tell you, using multiple images for rollover effects is going to be a big challenge in your dynamic scenario.
If this were my product page, I would use thumbnails with a bit of CSS opacity or filters to desaturate and make them full opacity/color on mouse over. Nice effect with much less bandwidth. Easily done globally with CSS code.
Two examples:
http://alt-web.com/GALLERY/GalleryTest.php
http://alt-web.com/TEMPLATES/CSS-Semi-liq-photo-sheet.shtml
Nancy O. -
How do you add multiple links to a rollover image?
Hi guys,
I'm pretty much a novice when it come to DW, but i understand some things and can get by with a simple website(i only use design mode).
Anyways, i understand how to use rollovers if its a basic image over image swap. My issue is, I have a link that says "T-shirts" and what i want is when you roll the mouse over that text, it swaps to another text -"1 or 2". Now on the "1 or 2" image, i want to have 2 seperate links on them. I tried using hotspots but to no avail. Everytime, the "1 or2" text comes out as a single link. Is doing this possible? I'm using CS4 if that helps btw.
Thanks!!I think you're trying to make something that is more complicated than it needs to be... First, as far as I know there is no easy way to accomplish what you're trying to do with a single image...
The first option would be to split your initial image in half, and create a rollover effect on the left half on rollover with the specified link 1, and add a second rollover effect on the right side image so that it also changes. Do the same with the right half image - create the rollover effect along with the link for that image only, then add a rollover script that affects the left side image (I've attached a very basic sample to demonstrate in the zip folder - note that there are two rollover images - each with a separate web link, and each has a rollover effect that affects both buttons...)
Second option is perhaps using a "Dropdown" menu that (on rollover) shows two more links... there are many ways this can be accomplished - the easiest (in my opinion) is by using the "spry menu bar". Once created, you can adjust the colors, fonts etc., and an image could be replaced on the initial link within the css... (my website is still under construction, but hopefully will show what I mean: http://www.jgigandet.com/) If you google "drop-down menu html, you'll find several other alternatives to spry as well...
Hope that helps...
Jesse -
Why are my rollover images not appearing correctly in my browser?
I have created rollover images for some of my site navigation, and when I view it in my browser, they are not in the correct place on the page. When I click on each rollover, it eventually goes to the right place when I return to that page, but I must do this to all rollover navigation buttons in order for them to show up in the correct place. The links work fine. I am relatively new to this, so not sure if I am providing all the correct info here. My site is www.pfeiferdesign.com. I am using DW CS4. Would appreciate any suggestions!! Thanks
Where is it you want the navigation to appear?
Try this CSS -
#mainnav {
clear: both;
display: block;
float:right;
margin-right:50px;
margin-top:25px;
overflow:hidden;
padding:0;
width:350px;
Is that anywhere close? -
Can't get rollover images to work as links [was: I have a question if someone could answer?]
I have fixed my page so I can preview it and everything is working fine but now I cant get my rollover images to work as links. When I go to put in the link like normal the rollover behavior stops working and it is just the original image. Any way for me to turn it into a link but still keep the rollover image change?
[Subject line edited by moderator. Please use more meaningful subject lines in future.]Can you provide a link to your website so we can see what you're seeing?
Without one, you're asking for an answer based on guesswork. -
Need help inserting 2 rollover images in a footer
I used two separate rollover images to put in a footer of a
page. When seeing in a browser I only see one rollover, the footer
is big enough I don't understand. Yet if I delete the second
rollover and copy the first underneath I see it in the browser but
after giving the image another name and swapping for the correct
images I disappears. I have no problem using the add hyperlink
which works fine. but the client insists I use the rollover images.
any help?To add to the advice from Ann, if you visit the Creative Cow website there are a mass of After Effects video tutorials where you will find one that is specifically for your task.
-
How to add a drop-down menu to a rollover image?
Hi,
I guess my title says it all... I was wondering how to add a drop-down menu to a rollover image? I know that there's the sprymenu, but I need to have my own rollover images.
Thanks,
KazemFrankly, ANY link can offer a drop down.
Take a look at this turorial.
That will get you your dropdown menu. So you have that.
Now, on your top menu (or any level where you want to have an image instead of text do this:
(I am copying the HTML structure in the tutorial here):
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Tutorials</a>
<ul>
<li><a href="#">Photoshop</a></li>
<li><a href="#">Illustrator</a></li>
<li><a href="#">Web Design</a></li>
</ul>
</li>
<li><a href="#">Articles</a>
<ul>
<li><a href="#">Web Design</a></li>
<li><a href="#">User Experience</a></li>
</ul>
</li>
<li><a href="#">Inspiration</a></li>
</ul>
</nav>
Now, let's pretend you want an image instead of the word "Articles." You'll want the image to be sized appropriately, and if you look at the CSS, you'll see it's 112 pixels wide by 52 high. If your image is approximately those dimensions, you're all set.
So instead of "articles" you insert your image.
Done. -
Horizontal Menu Bar Rollover image
I have been slowly piecing together some Horizontal Menu Bars
by learning from the code on this page...
http://labs.adobe.com/technologies/spry/samples/menubar/MenuBarSample.html
keeping that in mind my code is probably wrong in a number of
ways. The problem that I have run into and cant seem to solve on my
own is that I want one of my Horizontal Menu bars to have rollover
images only on the primary level. If you follow the link below you
can see what I have done thus far. The "tabs" are images and I want
them to rollover to another image, which is just the same tab in a
darker shade of grey. The tabbed menu bar is labeled MenuBar2 in
the code
http://www.du.edu/~dborges/test1.html
The other problem I’ve been having with both menu bars
is the way they appear in IE... it looks great in everything else.Hi Beth, I have been going crazy on this end with the Sub Menus showing up at the top of the Internet Explorer Browser. They work fine in FF and Chrome...
I have CS4 and tried reading everything possible.... here is my page. I am normally pretty good at resolving these issues but I'm going nuts.. ha!
http://www.ilovemydogfans.com/index-testdrops
Thank you for any assistance you can provide. I would be forever grateful!
Dave
David Abbott
I Love My Dog
[email protected] -
Swf file causing rollover images not to work
I've inserted a Flash file into my webpage in Dreamweaver and it broke all my rollover images. Even deleting the swf file and reinserting the rollover images doesn't work. I've read a few threads on this but can't quite find exactly what I'm looking for. I think it's something in the <head> code but I'm not sure. Any help would be much appreciated!
<head>
<title>Matt Relstab | Still Photography | Moving Pictures | Sound Design</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
//-->
<meta name="keywords" content="natural light photography, media producer boston, online media, photographs, sound design, audio for film, web video, video production,
boston production, portable recorder, digital photography, digital media production">
</script>
<style type="text/css">
<!--
body {
background-color: #3f4450;
-->
</style>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>For starters, look at the first line on your errant page, it starts out:
<meta name="keywords" content="audio reel, foley artist, sound effects mixer, audio mixer
boston, sound engineer, post production">
<html>
Thats not good. If you look at your other pages, the <html> tag is first, the way it should be.
Switch them around, then try this, remove your <html> tag (the very first tag is where is should be) and replace it with this
<!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">
See what that does for you.
Gary
On Edit: I just noticed that you have
<meta name="keywords" content="natural light photography, media producer boston,
online media, photographs, sound design, audio for film, web video, video production,
boston production, portable recorder, digital photography, digital media production">
inside your js for the rollovers...Move them out of the script.
GAry
Maybe you are looking for
-
Return delivery process with excise in MM module
Dear Friends, this is chandu working as a consultant-mm , please any one can give the clear information regarding return delivery process for excise material , i'm following one process that is after invoice verification 1) revers
-
In the View Responses functionality
In the View Responses section of a form, can I make the options for a datapoint a dropdown field rather than a free form field?
-
ORA-16766: Redo Apply is stopped while enabling Dataguard Broker
Hi all, I am using Oracle database 11g running in a Linux 5.4 (64 Bit) environment. I get the following error when trying to enable configuration. DGMGRL> show configuration Configuration Name: DG_AAI Enabled: YES Pro
-
Importing .mov from Kodak Zx1 Camcorder
Hey. I contact Kodak but they said to contact Adobe for this problem. Aparrently I'm not the only one. When taking video with my Zx1 (in this case, recording in HD 720p at 60fps, though the problem persists for all the different qualities I record
-
When I try to open a photo which is in a file folder (not iPhoto) the wrong photo opens. Instead of the one I'm trying to open, the photo next to it in the folder opens. Same thing when I drag that photo to the desktop. The one I'm dragging doesn't e