-1
我有擴展器與滑塊內部和外部頁面的畫廊。我想要在一個頁面上使用兩個畫廊。第一個完美工作,但第二個不工作。它看起來像缺少東西,但我不知道它是什麼。jquery函數不能在第二次工作
<!-- FIRST -->
<div class="portfolio-top"></div>
<!-- Portfolio Plus Filters -->
<div class="portfolio">
<!-- Portfolio Wrap -->
<div id="portfolio-wrap">
<!-- Portfolio Item FullScreen Expander -->
<div class="portfolio-item one-four uclu one_third">
<div class="portfolio-image">
<img src="ekipman/studyo-1.jpg" alt="Stüdyo"/>
</div>
<div class="project-overlay">
<div class="open-project-link">
<a class="open-project" href="studyo.html" title="Göster"></a>
</div>
<div class="project-info">
<div class="zoom-icon"></div>
<h4 class="project-name">Stüdyo</h4>
<p class="project-categories">Atölye Stüdyo</p>
</div>
</div>
</div>
<!-- Portfolio Item FullScreen Expander -->
</div>
<!--/Portfolio Wrap -->
</div>
<!--/Portfolio Plus Filters -->
<div class="portfolio-bottom"></div>
<!-- Project Page Holder-->
<div id="project-page-holder">
<div class="clear"></div>
<div id="project-page-data"></div>
</div>
<!--/FIRST-->
<!-- SECOND -->
<div class="portfolio-top"></div>
的Jquery:
$(window).load(function() {
// Project Page Expander
(function(){
var container = $("#project-page-holder");
var $items = $('#portfolio-wrap .open-project-link');
index = $items.length;
$('#portfolio-wrap .open-project-link').click(function(){
if ($(this).hasClass('active')){
} else
{ lastIndex = index;
index = $(this).index();
$items.removeClass('active');
$(this).addClass('active');
var myUrl = $(this).find('.open-project').attr("href") + " .item-data";
$('#project-page-data').animate({opacity:0}, 400,function(){
$("#project-page-data").load(myUrl,function(e){
var $helper = $('.helper');
var height = $helper.height();
$('#project-page-data').css("min-height", height);
$('.project-slider').css({'height' : ''});
$('#maximage').css({'height' : ''});
$('#maximage').maximage({
cycleOptions: {
fx: 'fade',
speed: 1000, // Has to match the speed for CSS transitions in jQuery.maximage.css (lines 30 - 33)
timeout: 6000,
prev: '#arrow_left',
next: '#arrow_right',
pause: 1,
},
});
});
$('#project-page-data').delay(400).animate({opacity:1}, 400);
});
$('html, body').animate({ scrollTop: $(".portfolio-bottom").offset().top -40}, 900);
//Project Page Open
$('#project-page-holder').slideUp(600, function(){
$('#project-page-data').css('visibility', 'visible');}).delay(1100).slideDown(1000,function(){
$('#project-page-data').fadeIn('slow',function(){initBxModal();});
$('.element_fade_in').each(function() {
$(this).appear(function() {
$(this).delay(100).animate({opacity:1,right:"0px"},1000);
});
});
});
}
return false;
});
//Project Page Close
$(document).on('click', '#project_close', function(event) {
$('#project-page-data').animate({opacity:0}, 400,function(){
$('#project-page-holder').delay(400).slideUp(400);
});
$('html, body').delay(1000).animate({ scrollTop: $(".portfolio-top").offset().top - 70}, 800);
$items.removeClass('active') ;
return false;
});
})(); });
$(window).load(function() {
// Project Page Expander
(function(){
var container = $("#project-page-holder2");
var $items = $('#portfolio-wrap2 .open-project-link2');
index = $items.length;
$('#portfolio-wrap2 .open-project-link2').click(function(){
if ($(this).hasClass('active')){
} else
{ lastIndex = index;
index = $(this).index();
$items.removeClass('active');
$(this).addClass('active');
var myUrl = $(this).find('.open-project2').attr("href") + " .item-data";
$('#project-page-data2').animate({opacity:0}, 400,function(){
$("#project-page-data2").load(myUrl,function(e){
var $helper = $('.helper');
var height = $helper.height();
$('#project-page-data2').css("min-height", height);
$('.project-slider').css({'height' : ''});
$('#maximage2').css({'height' : ''});
$('#maximage2').maximage({
cycleOptions: {
fx: 'fade',
speed: 1000, // Has to match the speed for CSS transitions in jQuery.maximage.css (lines 30 - 33)
timeout: 6000,
prev: '#arrow_left',
next: '#arrow_right',
pause: 1,
},
});
});
$('#project-page-data2').delay(400).animate({opacity:1}, 400);
});
$('html, body').animate({ scrollTop: $(".portfolio-bottom").offset().top -40}, 900);
//Project Page Open
$('#project-page-holder2').slideUp(600, function(){
$('#project-page-data2').css('visibility', 'visible');}).delay(1100).slideDown(1000,function(){
$('#project-page-data2').fadeIn('slow',function(){initBxModal();});
$('.element_fade_in').each(function() {
$(this).appear(function() {
$(this).delay(100).animate({opacity:1,right:"0px"},1000);
});
});
});
}
return false;
});
//Project Page Close
$(document).on('click', '#project_close', function(event) {
$('#project-page-data2').animate({opacity:0}, 400,function(){
$('#project-page-holder2').delay(400).slideUp(400);
});
$('html, body').delay(1000).animate({ scrollTop: $(".portfolio-top").offset().top - 70}, 800);
$items.removeClass('active') ;
return false;
});
})(); });
問題是,當我點擊第二個這是行不通的。謝謝。
也許你可以描述各功能之間的差異?並且「不起作用」並不意味着什麼,請更精確地請 –
對於動態添加的控件,請使用[event-delgation](http://learn.jquery.com/events/event-delegation/)。這是最好的我從長碼 – Satpal
瞭解所以實際上你只有一個功能?至少檢查你的控制檯是否有錯誤 –