Responsive Cycle2 (height + width)

by sambaldwin

HTML

<script src="http://malsup.github.com/min/jquery.cycle2.min.js"></script>
<div class="header">
</div>

<div class="cycle-slideshow" 
    data-cycle-timeout="0"
    data-cycle-slides="> div"
    data-cycle-next=".cycle-next"
    data-cycle-auto-height=container
    >
    <div class="cycle-slide">
        <a href="#" class="cycle-next">
            <img src="http://placehold.it/600x400" />
        </a>
    </div>

    <div class="cycle-slide">
        <a href="#" class="cycle-next">
            <img src="http://placehold.it/400x500" />
        </a>
    </div>
</div>

CSS

img {
    display:block;
    width:100%;
    height:auto;
}

.header {
    height:4em;
    background:yellow;
    margin-bottom:1em;
}