Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 11
  1. #1
    Junior Member ctam's Avatar
    Join Date
    Mar 2004
    Location
    Barcelona
    Posts
    26
    Member #
    5195
    Here's a toughy (well for me anyway):
    If you check this test page

    http://www.ctam.co.uk/mia/forumQ/test.htm

    you'll see that I was aiming to make the backgrounds of my boxes semi-opaque and have succeeded only where the boxes contain no anchors because the two techniques I found to do this have two major drawbacks:
    1.
    filterrogidXImageTransform.Microsoft.AlphaImageLoader(src='im ages/middleL.png',sizingMethod='scale');

    which looks good but then I discovered it does not allow anchors to work properly.
    (see here: http://www.ctam.co.uk/mia/forumQ/test1.htm )

    2.background-color: #FFFF33;
    filter:alpha(opacity=75);-moz-opacity:0.75;

    which makes everything in the box (including main images) semi-opaque which is not good for the content
    (see here: http://www.ctam.co.uk/mia/forumQ/test2.htm )

    I've messed about with this so much that i now can't see any solution other than settling for a solid box color. Can anyone tell me I'm wrong? I hope so.
    Thanks,
    Craig.
    Craig.

  2.  

  3. #2
    Senior Member Trico's Avatar
    Join Date
    Feb 2004
    Location
    Nottingham, UK
    Posts
    894
    Member #
    5081
    "Page not found."

  4. #3
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    Same error.
    Rednerve
    Creative Freelance Design

  5. #4
    Junior Member ctam's Avatar
    Join Date
    Mar 2004
    Location
    Barcelona
    Posts
    26
    Member #
    5195
    sorry

    My apologies for being a bit of a thicky (I uploaded them into the wrong folder). But they are there now. And one more BUT ... you'll need to use ie to view them properly.
    Craig.
    Craig.

  6. #5
    Senior Member Trico's Avatar
    Join Date
    Feb 2004
    Location
    Nottingham, UK
    Posts
    894
    Member #
    5081
    It might not work particularly well with the the rounded corners; but if you create a seamless tile of 50% transparent area and the last remaining half filled with your colour and repeated over an area. This will give a translucent illusion. The downside is you have little control over the actual effect other than playing with the intensity of the colour you go with.

  7. #6
    Member
    Join Date
    Aug 2004
    Location
    Ohio
    Posts
    47
    Member #
    7210
    Quote Originally Posted by ctam
    2.background-color: #FFFF33;
    filter:alpha(opacity=75);-moz-opacity:0.75;

    which makes everything in the box (including main images) semi-opaque which is not good for the content
    (see here: http://www.ctam.co.uk/mia/forumQ/test2.htm )
    You should be able to put a second container around the contents of the box. The outside container has the code to set it transparent; the inside container will set the opacity to 100%. The child container should take precedence, and so long as it has no background defined the text and images within would be solid while the background of their container is opaque.

  8. #7
    Junior Member ctam's Avatar
    Join Date
    Mar 2004
    Location
    Barcelona
    Posts
    26
    Member #
    5195
    Both great ideas and I will try each tomorrow. Thanks for your time and I'll let you know how it goes.
    Craig.
    Craig.

  9. #8
    Junior Member ctam's Avatar
    Join Date
    Mar 2004
    Location
    Barcelona
    Posts
    26
    Member #
    5195
    Quote Originally Posted by Usurper
    You should be able to put a second container around the contents of the box. The outside container has the code to set it transparent; the inside container will set the opacity to 100%. The child container should take precedence, and so long as it has no background defined the text and images within would be solid while the background of their container is opaque.
    Well, I've got the container div in place so now it's:
    .middleL_container and .middleL

    and I've got the following styles set:
    Code:
    .middleL_container{background-color:#FFFF33;
    filter:alpha(opacity=75);-moz-opacity:0.75; width:444px;
    }
    Code:
    .middleL{background-color:;
    filter:alpha(opacity=100);-moz-opacity:1.00;
    width:444px;
    border: solid #CC00CC;
    border-width: 0px 3px;}
    BUT as you can see here ( http://www.ctam.co.uk/mia/forumQ/test3.htm ) it doesn't appear to work. Is there something I've done wrong or is this what you meant?
    Thanks,
    Craig.
    Craig.

  10. #9
    Member
    Join Date
    Aug 2004
    Location
    Ohio
    Posts
    47
    Member #
    7210
    That's what I meant, and in theory I thought it would work. However, it's applying opacity as a fraction of the parent element's opacity, which makes sense, but is frustrating for this situation. I did try values greater than 1 just for the hell of it, but it won't go any higher than the parent element's opacity.

    You might have to go with absolute positioning in this case. That way, the opaque div and the solid div are both children of the body tag, so you can keep their settings separate.

  11. #10
    Junior Member ctam's Avatar
    Join Date
    Mar 2004
    Location
    Barcelona
    Posts
    26
    Member #
    5195
    OK, I've got there but as there always does, a spanner has appeared (2 in fact).
    First, the font has become quite ugly and second it is no longer possible to have the box stretch automatically and it now relies on a fixed height. I'm glad I now know this cos I'll use it in other sites but for this one the box will contain a blog and so I may just stick with the solid image repeating itself.
    See here http://www.ctam.co.uk/mia/forumQ/test4.htm
    Thanks for all your help.
    Craig.


Page 1 of 2 1 2 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 09:43 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com