Kód: Vybrať všetko

.obal .card {
  background-color: #CC0000;
  width: 100px;
  height: 100px;
  color: #fff;
  display: none;
}

.card.first {
  display: block;
}

Kód: Vybrať všetko

<script type="text/javascript">
    $(document).ready(function(){
        $('.card').click(function(){
            $(this).hide().next().show();
                $('.card:last-child').click(function(){
                    $('.card.first').show();
                });
        });
    });
</script>

Kód: Vybrať všetko

            <div class="obal">
                <div class="card first">Ahoj</div>
                <div class="card">Nazdar</div>
                <div class="card">Cuuus</div>
            </div>
            <div class="obal">
                <div class="card first">Ahoj</div>
                <div class="card">Nazdar</div>
                <div class="card">Cuuus</div>
            </div>

Kód: Vybrať všetko

$("#flipbox").flip({
	direction:'tb',
	content:'this is my new content'
})

Kód: Vybrať všetko

$("#flipbox").flip({
	direction:'tb',
	content: $("#content")
})

Kód: Vybrať všetko

$("#flipbox").flip({
   direction:'tb',
   content: $("#content_1")
})

Kód: Vybrať všetko

$("#flipbox").flip({
   direction:'tb',
   content: $("#content_2")
})

Kód: Vybrať všetko

$("#flipbox").flip({
   direction:'tb',
   content: $("#content_3")
})

Kód: Vybrať všetko

				$("#flipPad a:not(.revert)").bind("click",function(){
					var $this = $(this);
					$("#flipbox").flip({
						direction: $this.attr("rel"),
						color: $this.attr("rev"),
						content: $this.attr("title"),//(new Date()).getTime(),
						onBefore: function(){$(".revert").show()}
					})
					return false;
				});
				

Kód: Vybrať všetko

				        <div id="flipbox">Hello! I'm a flip-box! :)</div>
					<div id="flipPad">
						<a href="#" class="left" rel="rl" rev="#39AB3E" title="Change content as <em>you</em> like!">left</a>
						<a href="#" class="top" rel="bt" rev="#B0EB17" title="Ohhh yeah!">top</a>
						<a href="#" class="bottom" rel="tb" rev="#82BD2E" title="Hey oh let's go!">bottom</a>
						<a href="#" class="right" rel="lr" rev="#C8D97E" title="Waiting for css3...">right</a>
						<a href="#" class="revert">revert!</a>
					</div>