I will try two scalize id however only one more worked. Every time second scalize function worked. How can I use one more scalize in one page. I want use scalize in repater. I will try two scalize id however only one more worked. Every time second scalize function worked. How can I use one more scalize in one page. I want use scalize in repater. `
<div class="scalize" id="scalize2">
<!-- Start Popover Template -->
<div id="content6" class="content center top">
<div class="head">
<a href="#" class="exit"><img src="img/close.png" alt="" /></a>
<h6 class="title">4</h6>
</div>
<div class="body">
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
<p>Mel ad euismod adipiscing moderatius eos an decore quodsi animal.</p>
</div>
</div>
<div id="content4" class="content right top">
<div class="head">
<a href="#" class="exit"><img src="img/close.png" alt="" /></a>
<h6 class="title">5</h6>
</div>
<div class="body">
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
<p>Mel ad euismod adipiscing moderatius eos an decore quodsi animal.</p>
</div>
</div>
<div id="content5" class="content right bottom">
<div class="head">
<a href="#" class="exit"><img src="img/close.png" alt="" /></a>
<h6 class="title">6</h6>
</div>
<div class="body">
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
<p>Mel ad euismod adipiscing moderatius eos an decore quodsi animal.</p>
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
</div>
</div>
<!-- End Popover Template -->
<img src="img/deneme.jpg" alt="" class="target">
<!-- Start Item Point -->
<div class="item-point item-point2" data-top="121" data-left="922" data-popover="#content4">
<div><a href="#" class="toggle toggle2"></a></div>
</div>
<!-- End Item Point -->
<!-- Start Item Point -->
<div class="item-point item-point2" data-top="333" data-left="462" data-popover="#content5">
<div><a href="#" class="toggle toggle2"></a></div>
</div>
<!-- End Item Point -->
<!-- Start Item Point -->
<div class="item-point item-point2" data-top="444" data-left="546" data-popover="#content6">
<div><a href="#" class="toggle toggle2"></a></div>
</div>
<!-- End Item Point -->
</div>
<div class="scalize" id="scalize3">
<!-- Start Popover Template -->
<div id="content1" class="content right top">
<div class="head">
<a href="#" class="exit"><img src="img/close.png" alt="" /></a>
<h6 class="title">1</h6>
</div>
<div class="body">
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
<p>Mel ad euismod adipiscing moderatius eos an decore quodsi animal.</p>
</div>
</div>
<div id="content3" class="content right top">
<div class="head">
<a href="#" class="exit"><img src="img/close.png" alt="" /></a>
<h6 class="title">2</h6>
</div>
<div class="body">
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
<p>Mel ad euismod adipiscing moderatius eos an decore quodsi animal.</p>
</div>
</div>
<div id="content2" class="content right bottom">
<div class="head">
<a href="#" class="exit"><img src="img/close.png" alt="" /></a>
<h6 class="title">3</h6>
</div>
<div class="body">
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
<p>Mel ad euismod adipiscing moderatius eos an decore quodsi animal.</p>
<p>Lorem ipsum dolor sit amet, ne est populo dictas, et pri ferri ubique labitur.</p>
</div>
</div>
<!-- End Popover Template -->
<img src="img/2.jpg" alt="" class="target">
<!-- Start Item Point -->
<div class="item-point item-point3" data-top="320" data-left="922" data-popover="#content1">
<div><a href="#" class="toggle toggle3"></a></div>
</div>
<!-- End Item Point -->
<!-- Start Item Point -->
<div class="item-point item-point3" data-top="180" data-left="462" data-popover="#content3">
<div><a href="#" class="toggle toggle3"></a></div>
</div>
<!-- End Item Point -->
<!-- Start Item Point -->
<div class="item-point item-point3" data-top="192" data-left="546" data-popover="#content2">
<div><a href="#" class="toggle toggle3"></a></div>
</div>
<!-- End Item Point -->
</div>
<script type="text/javascript">
$(document).ready(function () {
$('#scalize2').scalize({
styleSelector: 'circle',
animationPopoverIn: 'fadeIn',
animationPopoverOut: 'fadeOut',
animationSelector: 'pulse2',
selector: '.item-point2',
getSelectorElement: function (el) {
$('.item-point2 .active').not($(el)[0]).find('.toggle2').click();
}
});
$('#scalize3').scalize({
styleSelector: 'circle',
animationPopoverIn: 'fadeIn',
animationPopoverOut: 'fadeOut',
animationSelector: 'pulse2',
selector: '.item-point3',
getSelectorElement: function (el) {
$('.item-point3 .active').not($(el)[0]).find('.toggle3').click();
}
});
});
</script>
`