flexslider を使用して一部のコンテンツをスライドさせます: http://iea.uili.com.br/v4/ 問題は、ズームインするときにタッチを無効にし、ズームアウトするときに元に戻すことです。キーボード コントロールと同じです。
建物をクリックしてズームインしたときの機能は次のとおりです
function janelas(){
$('.popup').click(function() {
var $id = $(this).attr('class').split(' ')[2];
$('.menu_janela').fadeOut('fast');
$("ul.flex-direction-nav").addClass('hide');
setTimeout(function(){
console.log('.'+$id+'-popup')
$('.'+$id+'-popup').fadeIn('fast');
},600);
});
}
ズームアウト時の機能はこちら
function fecha(){
$('.fechaa').click(function() {
$("ul.flex-direction-nav").removeClass('hide');
$('.menu_janela').fadeOut();
$('.view1').click();
});
$('.fechab').click(function() {
$("ul.flex-direction-nav").removeClass('hide');
$('.menu_janela').fadeOut();
$('.view2').click();
});
$('.fechac').click(function() {
$("ul.flex-direction-nav").removeClass('hide');
$('.menu_janela').fadeOut();
$('.view3').click();
});
$('.zoomContainer').click(function() {
$("ul.flex-direction-nav").removeClass('hide');
$('.menu_janela').fadeOut();
});
}
これがスライダーの機能です
function Slider(){
$captions = $('.captions');
$('.flexslider').flexslider({
animation: "slide",
slideshow: false,
animationSpeed: 1500,
controlNav: false,
keyboard: true,
touch: true,
start: function(slider) {
$activecaption = $('.flex-active-slide .flex-caption');
$captions.html($activecaption.text());
$('.loading-container').fadeOut(function() {
$(this).remove();
});
$('.centro').centro();
janelas();
fecha();
},
before: function(slide) {
},
after: function(slide) {
$activecaption = $('.flex-active-slide .flex-caption');
$captions.html($activecaption.text());
},
end: function(slide) {
},
});
}