Solved

Fading Images

Posted on 2004-10-04
5
467 Views
Last Modified: 2012-08-13
I'd like to draw an icon to the screen ,and have it invisible until the user moves their mouse over it. Once they do, it will gradually fade into view. Any ideas?
0
Comment
Question by:derekthornton
5 Comments
 
LVL 6

Expert Comment

by:viola123
ID: 12223970
<HTML>
      <HEAD><TITLE>Image opacity script - www.designplace.org</TITLE></HEAD>
<BODY text=#000000 bgColor=#ffffff>
<IMG id=tuxie style="FILTER: alpha(opacity=0)" src="sheep.bmp" onmouseover="setTimeout('fadein()',100)">
<SCRIPT>
value=0;

function fadein(){
      if (value<100) value+=5;

      document.getElementById("tuxie").filters[0].opacity=value;
      setTimeout('fadein()',100);
}
</SCRIPT>
</BODY></HTML>
0
 
LVL 6

Expert Comment

by:viola123
ID: 12224048
this code is able to fade in/out ,maybe it is better to fit your case,

<HTML>
      <HEAD><TITLE></TITLE></HEAD>
<BODY text=#000000 bgColor=#ffffff>
<IMG id=tuxie style="FILTER: alpha(opacity=0)" src="../images/E-Logo.jpg" onmouseover="setTimeout('fadein()',100)"
onmouseout="setTimeout('fadeout()',100)">
<SCRIPT>
value=0;
var t1=null;
var t2=null;

function fadein(){
      if (value<100) value+=5;

      document.getElementById("tuxie").filters[0].opacity=value;
      if (t2!=null) clearTimeout(t2);
      t1=setTimeout('fadein()',100);
}
function fadeout(){
      if (value>0) value-=5;

      document.getElementById("tuxie").filters[0].opacity=value;
      if (t1!=null) clearTimeout(t1);
      t2=setTimeout('fadeout()',100)
}
</SCRIPT>
</BODY></HTML>


cheers
viola
0
 
LVL 18

Accepted Solution

by:
armoghan earned 500 total points
ID: 12224096
if you need to use it using C#
Start a timer on Mouse over function and use the opacity from 0 to max

You can also see this article
http://www.codeproject.com/cs/media/CsTranspTutorial3.asp
0
 
LVL 2

Author Comment

by:derekthornton
ID: 12226130
it needs to be C# ..no HTML or anything ..but there is no opacity option for images or anything. Opacity only exists on forms.
0
 
LVL 22

Expert Comment

by:_TAD_
ID: 12230781

Actually the way you do it is to set the (??) Z-alpha part of the image to transparent.  I'm not a graphics guy, I just rememeber wanting to prorgram something like this a while back and looked into it.

In the end I would up embedding the picture into a control and then faded the control.  You *can* do an image directly, but the methods I found were more work than I was willing to do at the time.
0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Angular - break the dataset in chunks? 7 50
Entity Framework 7 41
Video Player 2017 5 20
HttpPostedFile 1 26
This article is for Object-Oriented Programming (OOP) beginners. An Interface contains declarations of events, indexers, methods and/or properties. Any class which implements the Interface should provide the concrete implementation for each Inter…
Exception Handling is in the core of any application that is able to dignify its name. In this article, I'll guide you through the process of writing a DRY (Don't Repeat Yourself) Exception Handling mechanism, using Aspect Oriented Programming.
This tutorial gives a high-level tour of the interface of Marketo (a marketing automation tool to help businesses track and engage prospective customers and drive them to purchase). You will see the main areas including Marketing Activities, Design …
Finds all prime numbers in a range requested and places them in a public primes() array. I've demostrated a template size of 30 (2 * 3 * 5) but larger templates can be built such 210  (2 * 3 * 5 * 7) or 2310  (2 * 3 * 5 * 7 * 11). The larger templa…

776 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question