Posted By

teedy on 10/07/09

Tagged

animation

Versions (?)

Last Edited at 10/07/09 03:24am

Statistics

Viewed 458 times

Favorited by 1 user(s)

Related snippets

Ransom, a simple jQuery tab menu with animation

/ Published in: jQuery

Hovering over a ransomTab animates in the ransomStrip of the same index

Highlighted TextExpand

<body class="">
	<h1>Ransom <em>by Cirrostratus Design Company</em></h1>
    <h2>A jQuery-powered tab menu inspired by iStockphoto.com</h2>
	<div id="ransom">
    	<div id="ransomMain">
    	</div>
        <div id="ransomTabs">
            <div class="ransomTab">
            	<p>Web</p>
            </div>
            <div class="ransomTab">
            	<p>Illustrations</p>
            </div>
            <div class="ransomTab">
            	<p>Video</p>
            </div>
        </div>
        
        <div class="ransomStrip" id="Web">
            <div class="ransomPrice">
            	<p>$10</p>
                <small>web</small>
            </div>
            <div class="ransomPrice">
            	<p>$20</p>
                <small>web</small>
            </div>
            <div class="ransomPrice">
            	<p>$40</p>
                <small>web</small>
            </div>
            <div class="ransomPrice">
            	<p>$50</p>
                <small>web</small>
            </div>
        </div>
        
        <div class="ransomStrip" id="Illustrations">
            <div class="ransomPrice">
            	<p>$5</p>
                <small>ill</small>
            </div>
            <div class="ransomPrice">
            	<p>$30</p>
                <small>ill</small>
            </div>
            <div class="ransomPrice">
            	<p>$40</p>
                <small>ill</small>
            </div>
            <div class="ransomPrice">
            	<p>$60</p>
                <small>ill</small>
            </div>
            <div class="ransomPrice">
            	<p>$90</p>
                <small>ill</small>
            </div>
        </div>
        
        <div class="ransomStrip" id="Video">
            <div class="ransomPrice">
            	<p>$15</p>
                <small>vid</small>
            </div>
            <div class="ransomPrice">
            	<p>$25</p>
                <small>vid</small>
            </div>
            <div class="ransomPrice">
            	<p>$50</p>
                <small>vid</small>
            </div>
        </div>
        
    </div>

URL: http://cirrostratusco.com/ransom_a-price-menu.php

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.