Web Analytics Made Easy -
StatCounter Change color + Transparency - CodingForum

Announcement

Collapse
No announcement yet.

Change color + Transparency

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Change color + Transparency

    Hi,

    I have the following event for a table:

    <td width="130" bgcolor="#F4F4FF" onmouseover="this.style.backgroundColor='#EEEEFF' onmouseout="this.style.backgroundColor='#F4F4FF'">

    How to I add the event below onmouseout:

    filter:alpha(opacity=10);


    I have tried:

    <td width="130" bgcolor="#F4F4FF; filter:alpha(opacity=10);" onmouseover="this.style.backgroundColor='#EEEEFF'" onmouseout="this.style.backgroundColor='#F4F4FF'">

    but it gives me a black background when I display the table.

    DHTMLHELP

  • #2
    <td width="130" bgcolor="#F4F4FF" onmouseover="this.style.backgroundColor='#EEEEFF' onmouseout="this.style.backgroundColor='#F4F4FF'" style="filter:alpha(opacity=10)">

    Comment


    • #3
      Hi Nightfire,

      what you suggest will make the whole td opaque. All I want is the background colour (only on mouseout or when dispplayed the first time after loading the page) to be opaque. Any other suggestions?

      DHTMLHELP

      Comment


      • #4
        Oh ok, sorry.

        Try using:

        <td width="130" bgcolor="#F4F4FF" onmouseover="this.style.backgroundColor='#EEEEFF' onmouseout="this.style.backgroundColor='#F4F4FF';this.style.filter:alpha(opacity=10)">

        Comment


        • #5
          Hi Nightfire,

          I have tried:

          this.style.filter='alpha(opacity=10)'

          but it gives me opacity of 10 for the whole td rather than only the bgcolor. Also it is activated only when onmouseover the first time.

          could there be a solution?

          DHTMLHELP

          Comment


          • #6
            Looks like we'll have to wait till the pro's come out. No good with this sort of stuff Sorry

            Comment


            • #7
              I'm no Pro!

              In order to have the background opacity at 10 and everything else at 100, you'll have to seperate it into two DIVs or TABLES.

              A rough example:
              http://www.angelfire.com/mo2/cbch21/...e.Opacity.html

              2 Tables with exact sizes and placements...

              Background with z-index:1
              Text with z-index:2 and background-color:transparent;

              I don't think the onMouseOver will work, though... maybe...


              <TABLE NAME="bgnd"......
              <TABLE NAME="text"......

              (Link on TABLE "text")
              <A HREF="#" onMouseOver="bgnd.style.backgroundColor='#EEEEFF' ">LINK</A>


              I'm sure that example won't work, but maybe someone here can fix it.
              Quيet Storm Designs ~ Art is not what you see, but what you make others see.
              · the Storms· || ·Ultraviolent Winter· || ·Was Einstein Wrong?· || ·It´s About Time!·

              Comment


              • #8
                Does anyone know of any other alpha attribute other than opacity. For example style.filter='alpha(transparency=10)'. The attribute transparency hasn't worked, hope someone knows an alternative.

                DHTMLHELP

                Comment


                • #9
                  Oops... almost forgot:

                  Because of a bug in IE, you'll have to also assign the width attribute in order for it to show up:

                  <STYLE="width:150px; Filter:alpha(Opacity=50);">

                  Sorry, forgot to meantion it before.

                  http://www.w3schools.com/dhtml/tryit...l_filter_image
                  Quيet Storm Designs ~ Art is not what you see, but what you make others see.
                  · the Storms· || ·Ultraviolent Winter· || ·Was Einstein Wrong?· || ·It´s About Time!·

                  Comment

                  Working...
                  X