I used Cycle2 for a simple slideshow, but when I resize the page the slideshow doesn't shrink with it.
I tried to disable CSS completely but it still the slidewhow is not addapting to the screen res. Downloaded the latest cycle2 file. Also tried in different browsers crome and firefox. Just want it to adapt to the screen px size.
<head>
<meta charset="utf-8">
<title>JS</title>
<!-- <link rel="stylesheet" href="css/JS.css"> -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="JS/jquery.cycle2.min.js"></script>
</head>
<body>
<div class="content-area">
<aside class="pics cycle-slideshow" data-cycle-slides=".slide" data-cycle-pause-on-hover="true">
<span class="cycle-prev">«</span>
<span class="cycle-next">»</span>
<span class="cycle-pager"></span>
<div class="slide">
<img src="images/bee.jpg" alt="bee" class=".responsive">
<div class="slide-text">
<h3>Bee, ipsum dolor.</h3>
<p>Lorem ipsum</p>
</div>
</div>
<div class="slide">
<img src="images/squirrel.jpg" alt="squirrel">
<div class="slide-text">
<h3>Squirrel, ipsum dolor.</h3>
<p>Lorem ipsum</p>
</div>
</div>
<div class="slide">
<img src="images/duck.jpg" alt="duck" >
<div class="slide-text">
<h3>Duck, ipsum dolor.</h3>
<p>Lorem ipsum <a href="#" class="btn-a">Action duck</a></p>
</div>
</div>
</aside>
<aside class="sidebar">
<h2>Sidebar text</h2>
<p>Lorem ipsum</p>
</aside>
<aside class="content">
<p>Lorem ipsum</p>
</aside>
</div>
ok so I'm a noob, but I found the aswer