Цитата:
Сообщение от рони
(Сообщение 275814)
aleksandr8i,
сделайте пример может тогда стаанет понятнее о чём вы.
|
При повторном показе
слайда 01 у #box_fly анимация уже выполнена, а хочется добиться что-бы при повторном показе слайда 01, #box_fly снова двигался(анимация).
<head>
<style>
/*cycle*/
.contain-cycle{width:590px;border:1px solid red;}
.cycle{position: relative;height: 287px;padding: 0;overflow: hidden;}
.cycle ul{position: relative;z-index: 1;height: 100%;}
.cycle li{height: 100%;width: 100% !important;}
.pager{text-align: center;display: inline-block;z-index: 2;top: -31px; position: absolute; width: 100%; top:100%; margin-top:-36px;}
#next_slide, #prev_slide {background:#333;width: 30px; height:30px; position: absolute; cursor:pointer; top:50%; z-index: 3; margin-top: -20px;}
#prev_slide {left: 0; margin-left:13px;}
#next_slide {right: 0; margin-right:9px;}
/*/cycle*/
.background1{background:#666;color:#fff;text-align:center;font-size:30px;}
#box_fly{width:200px;height:200px;background:#000;margin:0px;position:absolute;}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://strong-spirit-mazda.ru/js/jquery.cycle.all.min.js"></script>
<script type="text/javascript" src="http://strong-spirit-mazda.ru/js/jquery.pluginssiteimage.js"></script>
<script type="text/javascript">
if (!$.isFunction($.fancybox)) {
var loadingTimer, loadingFrame = 1;
body.append(loading = $('<div id="fancybox-loading"><div></div></div>'));
_animate_loading = function() {
if (!loading.is(':visible')) {
clearInterval(loadingTimer);
return;
}
$('div', loading).css('top', (loadingFrame * -40) + 'px');
loadingFrame = (loadingFrame + 1) % 12;
};
$.fancybox = function() {
};
$.fancybox.showActivity = function() {
clearInterval(loadingTimer);
loading.show();
loadingTimer = setInterval(_animate_loading, 66);
};
$.fancybox.hideActivity = function() {
loading.hide();
};
}
var imageCmsApiDefaults = {
hideForm: true,
messagePlace: 'ahead', // behind
durationHideForm: 3000,
cMsgPlace: 'after', //place error
captcha: function(ci) {
return '<div class="frame-label"><span class="title">' + captchaText + '</span>\n\
<span class="frame-form-field">\n\
<input type="text" name="captcha" value="' + captchaText + '"/> \n\
<span class="help-block" id="for_captcha_image">' + ci + '</span>\n\
</span></div>'
},
captchaBlock: '#captcha_block',
cMsg: function(name, text, classN, form) {
form.find('[for="' + name + '"]').remove();
return '<label for="' + name + '" class="for_validations ' + classN + '">' + text + '</label>';
}
// callback (callback accept (msg, status, form, DS)) where DS - imageCmsApiDefaults and "any other" ex. report_appereance has drop:".drop-report" if callback return true form hide
// any other
};
var genObj = {
msgF: '.msg',
err: 'error', //клас
scs: 'success', //клас
info: 'info' //клас
}
var message = {
success: function(text) {
return '<div class = "msg"><div class = "' + genObj.scs + '"><span class = "icon_info"></span><div class="text-el">' + text + '</div></div></div>'
},
error: function(text) {
return '<div class = "msg"><div class = "' + genObj.err + '"><span class = "icon_info"></span><div class="text-el">' + text + '</div></div></div>'
},
info: function(text) {
return '<div class = "msg"><div class = "' + genObj.info + '"><span class = "icon_info"></span><div class="text-el">' + text + '</div></div></div>'
}
};
var optionsDrop = {
overlayColor: '#000',
overlayOpacity: '0.6',
place: 'center', //noinherit(default) || inherit(ex. for ViewedProducts)
effon: 'fadeIn',
effoff: 'fadeOut',
duration: 500,
moreoneNC: false
};
function hideDrop(drop, form, durationHideForm) {
var drop = $(drop);
setTimeout(function() {
drop.drop('closeDrop', drop);
}, durationHideForm - 500/*time fadeout drop see on site*/)
setTimeout(function() {
drop.find(genObj.msgF).hide().remove();
form.show();
}, durationHideForm)
}
$(document).ready(function() {
if (ltie7) {
ieInput()
}
if (ltie8) {
}
try {
$('.cycle ul').cycle({
fx: 'fade',
timeout: 3500,
next: '#next_slide',
prev: '#prev_slide',
pager: '.pager',
pagerAnchorBuilder: function(idx, slide) {
return '<a href="#"></a>';
}
})
} catch (e) {
}
$('.menu-main').menuCorporate({
item: $('.menu-main').find('td'),
duration: 300,
drop: '.frame-item-menu > ul',
dropWidth: 500
})
$('[data-drop]').drop(optionsDrop);
$(document).on('drop.click showActivity', function(e) {
$.fancybox.showActivity();
})
$(document).on('drop.show drop.hide hideActivity', function(e) {
$.fancybox.hideActivity();
})
})
</script>
<script type="text/javascript">
$ (document).ready(function(){
$("#box_fly").animate({left: "200"} ,2000);
});
</script>
</head>
<body>
<div class="contain-cycle">
<div class="cycle container_slider">
<ul>
<li>
<div class="background1">Слайд 01</div>
<div id="box_fly">BOX FLY</div>
</li>
<li>
<div class="background1">Слайд 02</div>
</li>
<li>
<div class="background1">Слайд 03</div>
</li>
</ul>
<div class="pager p_r">
</div>
<div id="prev_slide"></div>
<div id="next_slide"></div>
</div>
</div>
</body>