www.webdeveloper.com
Results 1 to 9 of 9

Thread: Hover Button question??

  1. #1
    Join Date
    Nov 2002
    Posts
    6

    Hover Button question??

    I am using frames and have a question regarding hover buttons. I created some hover buttons on my left frame which stays there all the time. When I activate the button hyperlink it replaces the left frame page with the link rather than putting the page on the right side where I want it to go. Is the any way that I can make the hover button, when activated, replace the html page in the right side?

    Thanks, Don

  2. #2
    Join Date
    Nov 2002
    Posts
    984
    <a href="link" target="name of your right frame">click me</a>

    For more info look here
    http://www.w3.org/TR/html4/present/frames.html
    // Stefan Huszics

  3. #3
    Join Date
    Nov 2002
    Posts
    6
    Stephan,
    Thanks for the reply. I wasn't able to get the Hover button to work using the info you supplied.

    <a href="link" target="name of your right frame">click me</a>
    I tried Inserting it into the code but I guess I don't totally understand it and am not sure exactly where to put it in. Here is what Front Page generates when I create the hover button.

    <pre style="margin-top: 10; margin-bottom: -7">
    <applet code="fphover.class" codebase="../" width="120" height="24">
    <param name="text" value="Button Text">
    <param name="color" value="#000080">
    <param name="hovercolor" value="#0000FF">
    <param name="textcolor" value="#FFFFFF">
    <param name="effect" value="glow">
    <param name="url" valuetype="ref" value="geninfo.html">
    </applet>
    </pre>
    Where would be the proper place to intert the code?
    Thanks, Don

  4. #4
    Join Date
    Nov 2002
    Posts
    984
    Originally posted by anderdea
    [B]Stephan,
    Where would be the proper place to intert the code?
    I don't use frontpage and I have no way to guess what code it uses for that applet.

    In general though, you can read how to name frames in the link I provided.
    Then read the documentation you have for your applet and see how to add the target to it.
    // Stefan Huszics

  5. #5
    Join Date
    Nov 2002
    Posts
    421
    some time ago i tried to do the same thing with the FrontPage generated hover button. i concluded it could not be done. i created by own hover button using onmouseover and onmouseout. i suggest you do the same. in fact i suggest you quit using all of the FP generated effects as they all have brick walls you will find as you use them.

    try something like this:

    <form name="form1">
    <input style="background-color: #FF0033; color: white; font-weight: bold; width: 150; position: absolute; left: 15; top: 20;"
    type="button" value="Button Text"
    onmouseover="document.form1.button1.style.backgroundColor='#029AFE'"
    onmouseout="document.form1.button1.style.backgroundColor='#FF0033'"
    onclick="pur your href here"
    name="button1">
    </form>

    you can play with the colors and other parameters to get what you want. put your link in the onclick statement. there you need to include the target= as noted above by Stefan.

    sorry - not the answer you wanted, but i have been there with FP. it is a great first learning tool, but you outgrow its limitations fast.
    Last edited by Beach Bum; 12-05-2002 at 10:37 PM.

  6. #6
    Join Date
    Nov 2002
    Posts
    984
    A better way when you want to make your own buttons is to use CSS

    This will eg create buttons

    <div class="button">
    <a href="">text 1</a>
    <a href="">text 2</a>
    <a href="">text 3</a>
    </div>


    CSS:
    .button {width:150px;}
    .button a {display:block; background:#FF0033; }
    .button a:link {color:white;}
    .button a:hover {background:#029AFE;}

    The big advantage with this is that
    * you can reuse the same buttoneffect on many pages.
    * the links will work even if javascript is not available.
    * If you want to change to eg another "onmouseover" color, you only have to change 1 value in your 1 externally linked CSS file and your entire site will be instantly updated.
    Last edited by Stefan; 12-06-2002 at 10:34 AM.
    // Stefan Huszics

  7. #7
    Join Date
    Nov 2002
    Posts
    421
    anderdea - there you have two good options, using the button form or a link with CSS. try them both - as they will look different. so it depends on the effect you want.

    but thinking about my earlier post - i do not mean to be negative about FP. using its generated effects is a great way to learn - as proven here with this situation where you want to branch out from its limitations. so when i said you should stay away from its generated effects, what i should have said is you may quickly outgrow them but they are a great way to learn, and a great way to get up and running fast.

  8. #8
    Join Date
    Nov 2002
    Posts
    984
    Originally posted by Beach Bum
    [B]try them both - as they will look different. so it depends on the effect you want.
    The CSS version can of cource be modified to exactly mimic a form button if you like.
    CSS buttons will also look the same cross OS as well as cross browser. Form buttons will change appearance, especially from 1 OS to another.

    It does however require a little more effort to learn some CSS to work with them compaired to a simple cut and paste form button, but the benefits are quite large
    Also, the CSS you learn can be applied to any other part of your webpage too, not just buttons.
    // Stefan Huszics

  9. #9
    Join Date
    Nov 2002
    Posts
    6
    Thanks for the help,
    I'll give the CSS option a try this weekend.
    Don

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles