Results 1 to 10 of 10

Thread: No outline

  1. #1
    5 Star Lounger
    Join Date
    May 2001
    Location
    Allen, Texas, USA
    Posts
    727
    Thanks
    1
    Thanked 0 Times in 0 Posts

    No outline

    Can you someone tell me how not have graphics that are an actual link, no have a border and instead just show the actual graphic?
    Does that make sense?

    --KZ


    P.S.

    What I'm trying to do is make the following images not outlined as clickable. I know that I can use <a class=noUL>, but there is already a class assigned to that image. If I put my class last, the link doesn't mouseover correctly. Can anyone help?
    kokomobutton.jpg
    refugebutton.jpg
    picturebutton.jpg

    The page is located at:
    http://www.grace-efc.org/youth/testing/youth2.html

  2. #2
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: No outline

    For future reference, you can apply multiple classes by separating them with a space:

    [img]button.jpg[/img]

    I don't know which will override the other if there is a conflict; it's not something I hope to have to sort out. <img src=/S/wink.gif border=0 alt=wink width=15 height=15>

    But here is a simple fix, assuming it works. In your <style> definitions, you can remove borders from images inside the <a> tags, or more specifically, <a> tags of class "hrefmenu" by adding this on its own line:

    a.hrefmenu img {border: 0}

    Should fix what you want without breaking anything else.

    By the way, the "Kokomo" and "The Refuge" buttons only seem to be links for the left 2/3 of the image (pointer changes back to arrow over the right third). This might be a Firefox problem, as the mouseovers don't work at all, either. <img src=/S/sad.gif border=0 alt=sad width=15 height=15> I think you will need to save that for another day.

  3. #3
    5 Star Lounger
    Join Date
    Apr 2003
    Location
    Hampshire, United Kingdom
    Posts
    602
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: No outline

    The alternative to Jefferson's suggestion is to use the border attribute within the img tag itself. Jefferson's method will remove the borders of all the images of that particular class, so is probably what you're looking for. But if you ever want to remove the border (or change the border size) as a one-off, use [img]<!t>[image source]<!/t>[/img].
    Waggers
    If at first you do succeed, you&#39;ve probably missed something.

  4. #4
    5 Star Lounger
    Join Date
    May 2001
    Location
    Allen, Texas, USA
    Posts
    727
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Re: No outline

    jscher2000, thanks for your post.

    I kept playing around with the classes and it didn't work. Then I simply put in border="0" and that worked. Silly me! Thanks Dave for reminding me of that suggestion!
    Now it seems to work correctly as far as the images go. Thanks!

    As far as the image mouseover in Firefox, that's another issue. It works perfectly in IE with Maxthon as the overlay. Does any part of the mouse over work where it displays the images below it when you mouseover?

    --KZ

  5. #5
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: No outline

    Hi there

    In one forum someone suggested making it into a function to view in Firefox. Try this (so far untested0:

    <script type="text/javascript">
    function onmouseover(){
    alert('hello')
    };
    function onmouseout(){
    alert('bye')
    };
    </script>
    <div id="first" style="position:absolute; width:150px; height:160px;">
    <div id="inner" style="position:absolute; width:150px; height:160px;" onMouseOver="onmouseover()" onMouseOut="onmouseout()">
    [img]something.gif[/img]
    </div>
    </div>
    Jerry

  6. #6
    5 Star Lounger
    Join Date
    May 2001
    Location
    Allen, Texas, USA
    Posts
    727
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Re: No outline

    Thanks! I have no way to test it in Firefox. Maybe I need to download it for testing purposes.

    If you have time, I'd sure appreciate a workaround for this scripting. I like the way this handles a mouseover with several different results.

    --KZ

  7. #7
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: No outline

    <P ID="edit" class=small>(Edited by jscher2000 on 07-Nov-05 11:42. Script code attached!)</P>border="0" and style="border: 0" (or its equivalent in the <script> section) should give the same result. Because of the trend in HTML toward the separation of style information from structural information, the latter is considered "better." But not mandatory, obviously. <img src=/S/wink.gif border=0 alt=wink width=15 height=15>

    Regarding Firefox, when I mouse over one of your buttons, the Javascript console reports this error:
    <UL><code>Error: ie is not defined
    Source File: http://www.grace-efc.org/youth/testing/youth2.html
    Line: 108</code>

    [/list]The line of source in question is:

    if (ie) {

    If you scan up the script, you will see that there are two different conditions under which the variable ie can be set. One is if the browser recognizes the syntax document.layers, which is somewhat peculiar to Netscape version 4.x; the other is if it recognizes document.all, which is found in IE 4-5-6. So Netscape 6+, Mozilla 1.x, and Firefox fall through the cracks. This is a common problem with free script sites: most of their scripts are ancient and need substantial modernization.

    If I get a chance, I'll post a revised version.

    Added: Well, the buttons still behave strangely but the attached script will work in Netscape 6, 7, 8, Mozilla 1.x, and Firefox.
    Attached Files Attached Files

  8. #8
    5 Star Lounger
    Join Date
    May 2001
    Location
    Allen, Texas, USA
    Posts
    727
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Re: No outline

    Thanks for the attachment!

    Look at this update called youth3. What does that do in Firefox?

    http://www.grace-efc.org/youth/testing/youth3.html

    --KZ

  9. #9
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: No outline

    I have just viewed it, I seem to be getting a roll over effect, although my only criticism, is that I am on a dial up machine and it a little too long for it to download.

    As I roll over KOKOMO| The Refuge |Pictures, the main image changes and I get another roll over change for the description on the right, no faults detected in FireFox.
    Jerry

  10. #10
    5 Star Lounger
    Join Date
    May 2001
    Location
    Allen, Texas, USA
    Posts
    727
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Re: No outline

    Thanks for checking on it for me!
    Sounds like it's working now in FF. Nothing is set up to be clickable yet, just trying to get the rolloever effect.

    Thanks jscher2000 for this helpful update and noticing the problem! You guys are great.



    --KZ

Posting Permissions

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