Welcome Guest ( Log In | Register)



 
 Reply to this topicStart new topic
> Blendtrans Filter With Onmouseover?, anybody got a good code?
nickmealey
post Mar 16 2005, 04:45 AM
Post #1


Premium Member
********

Group: Members
Posts: 156
Joined: 14-March 05
From: Washington, USA
Member No.: 4,520
I need the best way to do a blendTrans filter, BUT IT HAS TO BE INCORPERATED INTO ONMOUSEOVER. I'd aprictiate it.

(list)

Go to the top of the page
 
+Quote Post
andrewsmithy
post Mar 16 2005, 05:17 AM
Post #2


Newbie [Level 1]
*

Group: Members
Posts: 19
Joined: 16-March 05
From: United States
Member No.: 4,570
I did a blendTrans effect on one of my projects, and here is the code. I had this in my script tag:

CODE

// rollover functions

   if (document.images) {

     imagearray = new Array();

     imagearray[0] = "images/nav1.gif";
     imagearray[1] = "images/nav1on.gif";

     inum = new Array();

     for (i=0; i<imagearray.length; i++) {
          inum[i] = new Image();
          inum[i].src = imagearray[i];
     }
}

function imgchange (imgName, imagenum) {
   if (document.images) {
     if (navigator.appName.indexOf("Microsoft Internet Explorer") {
         // Internet Explorer
         document[imgName].filters(0).apply();
         document[imgName].src = inum[imagenum].src;
     document[imgName].filters(0).play();
     } else {
         // Other browsers that don't support it
         document[imgName].src = inum[imagenum].src;
     }
   }
}


Next, you need to put this in the <style> tag:
CODE

   img {
       filter: blendTrans(duration=1.0);
   }


This contains the code that powers the rollover. Now to apply it:

CODE

<a href="" onmouseover="imgchange('nav1',1)" onmouseout="imgchange('nav1',0)">
<img name="nav1" src="images/nav1.gif" width="130" height="20" alt="" border="0" />
</a>


Let me briefly explain the imgchange function...

function imgchange ( image_name, array_index[I]);

This is put in the onmouseover and onmouseout statements. The [I]image_name refers the the <img name="value" /> reference, and the array_index refers the the image in the array index value. Example: changeimg('name',0) would refer to imagearray[0]. make sure that you have placed a name="value" in the image tag, and that the changeimg(name,5) in the onmouseover and onmouseout match this.

To add more images...

To add more images, you simply need to put another imagearray[next_number] = "images/nav3on.gif"; in the script tag, where next_number equals the next array number. Ok? Then add another <a href="#link" onmouseover="changeimg(...)" onmouseout="changeimg(...)"><img src="" name="next_img" /></a> in the body where you want it. Hope you all can figure this out.

NOTE: The reason why we test and see if the browser is IE is because this only works in Internet Explorer. Other browsers will just see a standard rollover; If you want to change the duration of the effect, change the duration length (its in seconds.)

(list)

Go to the top of the page
 
+Quote Post
« Next Oldest · HTML, XML etc.. · Next Newest »
 

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Whats The Best Code?(32)
  2. Disable Scrollbars, Menubars Etc....(6)
  3. I Forgot A Code(7)
  4. Scroll Color(2)
  5. Redirect Code Help(8)
  6. List-style Help(2)
  7. W3c Compliant Flash(0)
  8. I Finally Found A Simple Way To Do A Blendtrans(1)
  9. Total Lines Of Code(3)
  10. Code For This Table Layout?(6)
  11. What Is The Xhtml 1.1 Code To Embed An Applet?(2)
  12. Code To Autocomplete A Form?(7)
  13. Realtime/wma Player In Websites(5)
  14. Html Question Concerning Pre Tag And Code Tag(8)
  15. Have You Used This Html Code?(9)
  1. Screen Resolution(6)
  2. Morse Code(4)
  3. My Very Sad Code(4)
  4. Transparent Roll Over Pictures(4)
  5. How To Display Php Code [resolved](8)
  6. Email Form Code(8)
  7. I Need Help With This Code(3)
  8. Applet Code(0)


 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 11th October 2008 - 09:46 PM
Powered By IP.Board © 2008  IPS, Inc.
Licensed to: Xisto Corporation