Güzel bir sliderim var fakat zoom özelliği yok acaba elimdeki mevcut slidere zoom özelliği ekleyebilirmiyiz. Yardımcı olursanız çok menmun olurum. Ayrıca bu slideri r10 daki bir arkadaşın konusunda buldum ve kendi scriptime monte edeceğim.
Elimdeki kodlar:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jquery</title>
<link rel="stylesheet" href="global.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="slides.min.jquery.js"></script>
<script>
$(function(){
$('#products').slides({
preload: true,
preloadImage: 'img/loading.gif',
effect: 'slide, fade',
crossfade: true,
slideSpeed: 350,
fadeSpeed: 500,
generateNextPrev: true,
generatePagination: false
});
});
</script>
</head>
<body>
<div id="container">
<div id="products_example">
<div id="products">
<div class="slides_container">
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-3-2x.jpg" width="366" alt=""></a>
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-1-2x.jpg" width="366" alt=""></a>
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-2-2x.jpg" width="366" alt=""></a>
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-4-2x.jpg" width="366" alt=""></a>
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-5-2x.jpg" width="366" alt=""></a>
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-6-2x.jpg" width="366" alt=""></a>
<a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="1144953-p-2x.jpg" width="366" alt=""></a>
</div>
<ul class="pagination">
<li><a href="#"><img src="1144953-3-2x.jpg" width="55" alt="1144953 3 2x"></a></li>
<li><a href="#"><img src="1144953-1-2x.jpg" width="55" alt="1144953 1 2x"></a></li>
<li><a href="#"><img src="1144953-2-2x.jpg" width="55" alt="1144953 2 2x"></a></li>
<li><a href="#"><img src="1144953-4-2x.jpg" width="55" alt="1144953 4 2x"></a></li>
<li><a href="#"><img src="1144953-5-2x.jpg" width="55" alt="1144953 5 2x"></a></li>
<li><a href="#"><img src="1144953-6-2x.jpg" width="55" alt="1144953 6 2x"></a></li>
<li><a href="#"><img src="1144953-p-2x.jpg" width="55" alt="1144953 P 2x"></a></li>
</ul>
</div>
</div>
</body>
</html>