Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2009
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    alpha filter question in internet explorer

    Hey,

    I am trying to make links progressively less alpha. A fading is based on text size. PHP does all the calculations, to produce code similar to the following code. However, the actual HTML here does not seem to work.

    Code:
    <body style="font-weight:bold;">
    
    <h3>Tags</h3><br />
    <a href='http://link' style='font-size: 22pt; filter:alpha(opacity=50); opacity: 0.5; '>Link One</a> 
    <a href='http://link' style='font-size: 16pt; filter:alpha(opacity=71.4285714286); opacity: 0.714285714286; '>Link Two</a> 
    <a href='http://link/' style='font-size: 8pt; filter:alpha(opacity=100); opacity: 1; '>Link Three</a> 
    <a href='http://link/' style='font-size: 14pt; filter:alpha(opacity=78.5714285714); opacity: 0.785714285714; '>Link Four</a> 
    
    </body>
    If you test this code in firefox, it works fine, but the filter:alpha, for internet explorer, does not seem to work.

    Is there another way to have this same affect?

    Thanks,
    Grae

  • #2
    New to the CF scene
    Join Date
    May 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The alpha filter in IE only works on an element that has "layout." In order to give an element this magical layout, set its height or width property, or give it absolute position. An example:

    Code:
    <p style="width: 100%; filter: alpha(opacity=50);">wibble</p>
    There's a ton of excruciating detail on the following page:

    http://msdn.microsoft.com/en-us/libr...67(VS.85).aspx

  • #3
    New Coder
    Join Date
    May 2009
    Posts
    74
    Thanks
    0
    Thanked 7 Times in 7 Posts
    Quote Originally Posted by caalip View Post
    Hey,

    I am trying to make links progressively less alpha. A fading is based on text size. PHP does all the calculations, to produce code similar to the following code. However, the actual HTML here does not seem to work.

    Code:
    <body style="font-weight:bold;">
    
    <h3>Tags</h3><br />
    <a href='http://link' style='font-size: 22pt; filter:alpha(opacity=50); opacity: 0.5; '>Link One</a> 
    <a href='http://link' style='font-size: 16pt; filter:alpha(opacity=71.4285714286); opacity: 0.714285714286; '>Link Two</a> 
    <a href='http://link/' style='font-size: 8pt; filter:alpha(opacity=100); opacity: 1; '>Link Three</a> 
    <a href='http://link/' style='font-size: 14pt; filter:alpha(opacity=78.5714285714); opacity: 0.785714285714; '>Link Four</a> 
    
    </body>
    If you test this code in firefox, it works fine, but the filter:alpha, for internet explorer, does not seem to work.

    Is there another way to have this same affect?

    Thanks,
    Grae


    Try replacing your css with this :


    <a href='http://link' style='font-size: 22pt; filter:alpha(opacity=50); opacity: 0.5; width:100%; display:block;'>Link One</a>


    Regards,


  •  

    Tags for this Thread

    Posting Permissions

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