Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Image does not swap with Layers - Behaviors

Posted on 2004-09-20
8
308 Views
Last Modified: 2013-12-24
Hello all. I'm trying to get an image to swap with a mouse over.   But I have a feeling it is not possible in this situation -- unless an EXPERT has a solution.

FIrst please look at this page:  http://www.freecreditcardprocessing.com/maa/

If you hover over the image that says "Free internet software", you will see the image change .

I'm trying to do the same thing with this test recreation at:  http://www.rowby.com/cards/

If you hover over the text box that says "Image does not swap" you will see that the image does not swap :)

The behaviour I gave the layer is onmouseover swapimages.  I included the second image but it does not work. Probably, I assume, because the initial layer is text, not a graphic.

Is there a workaround?  I already have a behaviour "onclick" gotourl present.

Here is a copy and paste of the relevant source code:

<div style="position: absolute; width: 161px; height: 171px; cursor: hand;  z-index: 1; left: 34px; top: 293px" id="layer2" onclick="FP_goToURL(/*href*/'http://www.rowby.com')" onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'images/004a.jpg')">
                                                                        <table border="2" cellspacing="0" style="border-collapse: collapse" width="103%" id="table127" height="137" cellpadding="2" bordercolor="#0534B3">
                                                                              <tr>
                                                                                    <td height="24" bgcolor="#0534B3">
                                                                                    <p align="center"><b>
                                                                                    <font face="Arial" color="#FFFFFF">
                                                                                    SOFTWARE</font></b></td>
                                                                              </tr>
                                                                              <tr>
                                                                                    <td valign="top" bgcolor="#FFFFFF">
                                                                                    <p align="center"><b>
                                                                                    <font size="6" face="Arial" color="#FF0000">
                                                                                    FREE<br>
                                                                                    </font>
                                                                                    <font face="Arial">
                                                                                    Experts Exchange<br>
                                                                                    Image Does not &quot;swap&quot;</font></b></td>
                                                                              </tr>
                                                                        </table>
                                                                        </div>



THANKS!
0
Comment
Question by:Rowby Goren
  • 5
  • 2
8 Comments
 
LVL 31

Expert Comment

by:seanpowell
ID: 12110310
I'm confused, are they both your sites?
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 12111925
HI

 http://www.freecreditcardprocessing.com/maa/ is client site.  I have been asked to make the page load faster.  It is filled with graphics (among other things) which is making the page load very slowly.  

I am making testing the change at http://www.rowby.com/cards/.   Once the changes are made then the page will be moved to the client site.

So far I have replaced most of the graphics with text.  All that remains is to recreate the image swap --if possible.  

Rowby

0
 
LVL 14

Accepted Solution

by:
hhammash earned 500 total points
ID: 12119848
Hi,

Create your texts on layers and onhover show the layer.  You can give the layers the same position and size of the picture.

hhammash
0
What is SQL Server and how does it work?

The purpose of this paper is to provide you background on SQL Server. It’s your self-study guide for learning fundamentals. It includes both the history of SQL and its technical basics. Concepts and definitions will form the solid foundation of your future DBA expertise.

 
LVL 9

Author Comment

by:Rowby Goren
ID: 12122368
Hi hhmmash,

That sounds like it would do it.  

Cna you give me the code to insert into the source -- I can't seem to find those particular behavours in FrontPage 2003's "Insert Behavious" menu.

Once you give it to me I can find tune the position etc.

Thanks!
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 12133245
I tried this code, but it doesn't work:   Any suggestions?  If not from Hhammash, anyone else??? -- I will split points....

<div style="position: absolute; width: 161px; height: 171px; cursor: hand;  z-index: 1; left: 36px; top: 303px" id="layer2" onclick="FP_goToURL(/*href*/'http://www.rowby.com')" onhover="FP_showLayer('layer4')">

Here is the link to the current TEST page:  

http://www.rowby.com/cards/

Thanks
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 12136740
Thanks for the overall answer, hammash.

I am posting a new question asking for refinement of the code. I can't find the behaviour etc in the built in Front Page behaviour menu, so I tried writing it myself, but it doesn't work right yet.

0
 
LVL 14

Expert Comment

by:hhammash
ID: 12138618
Sorry rowby I was away for two days.  I read your question for the code just now.
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 12138656
No problem.  You can answerit in the new updated question.  
0

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When deciding to adopt any help desk solutions many factors should be explored before taking decisions. This will change from business to another but in general there are some kind of rule of thumb. Here are some quick tips: Do we need only ticket…
Now that Expression Web 4.0 (http://www.microsoft.com/expression/products/Upgrade.aspx) is free if you buy or have the full version of Expression Web 3.0, now is the best time to  migrate from FrontPage to Expression Web (http://www.frontpage-to-exp…
The purpose of this video is to demonstrate how to insert an Iframe into WordPress. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp-login.php : Open Page or Post…
The purpose of this video is to demonstrate how to set up the permalinks on a WordPress Website. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp-login.php : Go t…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question