www.webdeveloper.com
Results 1 to 2 of 2

Thread: Image Opacity

  1. #1
    Join Date
    Aug 2005
    Posts
    23

    Image Opacity

    Hello All,

    I am making an image gallery. I have it basically set up now (thanks to you guys here at WD), and I have one more question. I would like the thumbnails at the top of my page (here's an example of the gallery: Click! ) to display at 50% opacity until either they're moused over, or they're clicked on. Is this at all possible? Here is my current javascript:
    PHP Code:
    var img = new Array(6); //array to hold the images
    var counter 0//counts the image sequences

    if(document.images//pre-load all the images
     
    {
       for(
    1<= 6i++)
       {
         
    img[i] = new Image();
         
    img[i].src "images/gallery1-" ".jpg";
       }
     }
     
    function 
    next()
     {
       
    counter++;
       if(
    counter == img.length)
        
    counter 1;
       
    document.theimage.src img[counter].src;
     }
     
    function 
    prev()
     {
       
    counter--;
       if(
    counter <= 0)
        
    counter img.length 1;
       
    document.theimage.src img[counter].src;
     }

      function 
    thumb(i)
     {
       if (
    document.theimage){
    document.theimage.src img[i].src;
    document.theimage.style.display="block";
    }
    counter i
    return true


    and here is an example of the code of one of the images in case that helps:
    PHP Code:
    <a href="#" onClick="thumb(1);return false"><img name="1" src="thumbnails/gallery1-1T.jpg" width="45" height="60"></a
    Hope that all makes sense. Thanks much!

    -Jon

  2. #2
    Join Date
    Dec 2005
    Location
    Queen Creek, AZ
    Posts
    1,564
    it's a style filter and it's called Chroma

    post a question about adding a chroma filter to an image in the CSS forum and someone will give you an answer, it's a common thing people want.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles