# Stacking GIFs w/transparent backgrounds?

**URL:** <https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826>\
**Category:** Rails\
**Created:** [February 26, 2007, 8:21am UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826 "2007-02-26T08:21:56Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![iceburgh](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/i/c4cdca/32.png) [@iceburgh](https://www.ruby-forum.com/u/iceburgh)\
**Post date:** [February 26, 2007, 8:21am UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826/1 "2007-02-26T08:21:56Z")

</div>

I realize that this isn’t exactly a Rails question, but I  
_am_ planning to use the information for a Rails app :-).

I’m interested in stacking GIFs w/transparent backgrounds,  
then using JavaScript to hide/show certain images. This  
will (it says here 🙂 let the user cause different parts  
of a diagram to appear and disappear.

Problem is, I haven’t found a way to stack images so that  
this works. I’m using an opaque white image as the bottom  
image, then layering others (with transparent backgrounds)  
on top. If I set the opacity to (say) 0.5, I see all of  
the diagrams, with different amounts of haziness. Help?

## -r

[http://www.cfcl.com/rdm](http://www.cfcl.com/rdm) Rich M.  
[http://www.cfcl.com/rdm/resume](http://www.cfcl.com/rdm/resume) removed\_email\_address@domain.invalid  
[http://www.cfcl.com/rdm/weblog](http://www.cfcl.com/rdm/weblog) +1 650-873-7841

Technical editing and writing, programming, and web development

---

<div class="post-metadata">

**Author:** ![iceburgh](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/i/c4cdca/32.png) [@iceburgh](https://www.ruby-forum.com/u/iceburgh)\
**Post date:** [February 26, 2007, 9:06am UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826/2 "2007-02-26T09:06:59Z")

</div>

Never mind. Somehow, I didn’t have transparent backgrounds.

## -r

[http://www.cfcl.com/rdm](http://www.cfcl.com/rdm) Rich M.  
[http://www.cfcl.com/rdm/resume](http://www.cfcl.com/rdm/resume) removed\_email\_address@domain.invalid  
[http://www.cfcl.com/rdm/weblog](http://www.cfcl.com/rdm/weblog) +1 650-873-7841

Technical editing and writing, programming, and web development

---

<div class="post-metadata">

**Author:** ![iceburgh](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/i/c4cdca/32.png) [@iceburgh](https://www.ruby-forum.com/u/iceburgh)\
**Post date:** [February 26, 2007, 11:50am UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826/3 "2007-02-26T11:50:24Z")

</div>

In case anyone is interested, I hacked up some JavaScript  
to do dynamic composition of (Graphviz) diagrams:

Diagram Composition  
[http://www.cfcl.com/rdm/diagrams/dc.html](http://www.cfcl.com/rdm/diagrams/dc.html)

Dynamic Diagram Composition  
[http://www.cfcl.com/rdm/diagrams/ddc.html](http://www.cfcl.com/rdm/diagrams/ddc.html)

## -r

[http://www.cfcl.com/rdm](http://www.cfcl.com/rdm) Rich M.  
[http://www.cfcl.com/rdm/resume](http://www.cfcl.com/rdm/resume) removed\_email\_address@domain.invalid  
[http://www.cfcl.com/rdm/weblog](http://www.cfcl.com/rdm/weblog) +1 650-873-7841

Technical editing and writing, programming, and web development

---

<div class="post-metadata">

**Author:** ![iceburgh](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/i/c4cdca/32.png) [@iceburgh](https://www.ruby-forum.com/u/iceburgh)\
**Post date:** [February 26, 2007, 11:59am UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826/4 "2007-02-26T11:59:24Z")

</div>

I’m facing the same problem as you.  
I need to stack different images on each other dynamically when a user  
selects something from a list.

How did you do it? Did you use css?

---

<div class="post-metadata">

**Author:** ![iceburgh](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/i/c4cdca/32.png) [@iceburgh](https://www.ruby-forum.com/u/iceburgh)\
**Post date:** [February 26, 2007, 1:49pm UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826/5 "2007-02-26T13:49:39Z")

</div>

try this:

[http://pastebin.ca/372959](http://pastebin.ca/372959)

---

<div class="post-metadata">

**Author:** ![iceburgh](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/i/c4cdca/32.png) [@iceburgh](https://www.ruby-forum.com/u/iceburgh)\
**Post date:** [February 26, 2007, 5:05pm UTC](https://www.ruby-forum.com/t/stacking-gifs-w-transparent-backgrounds/86826/6 "2007-02-26T17:05:12Z")

</div>

At 2:58 AM -0800 2/26/07, Joram wrote:

> I’m facing the same problem as you. I need to stack  
> different images on each other dynamically when a user  
> selects something from a list.
> 
> How did you do it? Did you use css?

CSS, HTML, and JavaScript - do a “View Source”

> On 26 feb, 11:49, Rich M. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) wrote:
> 
> > In case anyone is interested, I hacked up some JavaScript  
> > to do dynamic composition of (Graphviz) diagrams:
> > 
> > Diagram Composition  
> > [http://www.cfcl.com/rdm/diagrams/dc.html](http://www.cfcl.com/rdm/diagrams/dc.html)
> > 
> > Dynamic Diagram Composition  
> > [http://www.cfcl.com/rdm/diagrams/ddc.html](http://www.cfcl.com/rdm/diagrams/ddc.html)

## -r

[http://www.cfcl.com/rdm](http://www.cfcl.com/rdm) Rich M.  
[http://www.cfcl.com/rdm/resume](http://www.cfcl.com/rdm/resume) removed\_email\_address@domain.invalid  
[http://www.cfcl.com/rdm/weblog](http://www.cfcl.com/rdm/weblog) +1 650-873-7841

Technical editing and writing, programming, and web development
