[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 164
  • Last Modified:

Using CSS to fade out things.

Ok, I am trying to use CSS's alpha property to make a button fade out when I click another.  I need to use timeout, but don't understand it enough to make it work.  My code is:

<HEAD>
<SCRIPT>
blah=100
function fadeout() {
dimbutton.filters.item(0).enabled = 1
dimbutton.filters.item(0).opacity = blah
while (blah>1)
 {blah --
setTimeout("StepItDown()", (100-blah)*100)
 }
}
function StepItDown()
{
dimbutton.filters.item(0).opacity = blah
}

</SCRIPT>
</HEAD>



<INPUT type="button" value="Click me" id=dimbutton style="filter:Alpha(enabled=0)">


<INPUT type="button" style="position:absolute; top:40; left:220" value="Fade it out" onclick = "fadeout()" >


Now, it works, but it doesn't fade, it just executes the script and counts down 100 to 1, and THEN updates the screen... I know there's an easy was to fix this...
0
Radioman2024
Asked:
Radioman2024
  • 3
1 Solution
 
tewaldCommented:
Give this a try Radioman:

<html>
<head>
<script>
<!--
blah=5000
function fadeout() {
     dimbutton.filters.item(0).enabled = 1
     dimbutton.filters.item(0).opacity = blah
     for(blah = 5000; blah > 0; blah--) {
          dimbutton.filters.item(0).opacity = blah
     }
}
//->
</script>
</head>
<body>
<input type="button" value="Click Me" id=dimbutton style="filter:Alpha(enabled=0)"><br>
<input type="button" style="position:absolute; top:40; left:220" value="Fade It Out" onclick = "fadeout();">
</body>
</html>
0
 
tewaldCommented:
Radioman, I think I missed your point with my last comment...  skip it.  However, I'm pretty sure you can't fade-out a button.
0
 
tewaldCommented:
Thanks for the "A" Radioman.
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now