Masquer element(Slider) lorsque j'utilise un effet accordeon

Signaler
-
Bonjour,

Je travaille en local et j utilise le theme wordpress Garnish et le plugin easing slide lite.

Garnish DEMO:
http://themeforest.net/item/garnish-cleancut-wordpress-portfolio-theme/full_screen_preview/308989

Cela fonctionne tres bien, mais je voudrais faire disparaitre le slide quand je clique sur une image du portfolio. Et juste avoir le portfolio en dessous de l'effet accordeon(Magicdoor).

Je choisis d'ouvrir le portfolio avec magicdoor mais avec je n'ai pas les permaliens. Donc, je ne peux pas utiliser ce code.
    <?php if(is_front_page()) { if (function_exists("easingsliderlite")){ easingsliderlite(); } } ?>



Le code php de mon header.php ressemble a ceci:

<?php
/*
Template Name: Home
*/
?>

<?php get_header(); ?>

<?php if(is_front_page()) { if (function_exists("easingsliderlite")){ easingsliderlite(); } } ?>

<!--BEGIN #portfolio-terms-->
<div id="portfolio-terms">
<span class="lin"></span>
<ul>
<li>
<a href="#" class="all active"><?php _e('All', 'framework'); ?></a><span>/</span>
</li>
<?php
wp_list_categories(array(
'title_li' => '',
'taxonomy' =>
'skill-type',
'walker' => new Portfolio_Walker(),
'show_option_none' => ''
)
); ?>

</ul>

<!--END #portfolio-terms-->
</div>

<!--BEGIN #primary .hfeed-->
<div id="primary" class="hfeed">

<?php

//Grab magic door option
$magic_door = get_option('tz_magic_door');

$post_id = get_option('tz_magic_door_state');

if($magic_door != 'true')
$magic_door = FALSE;

if($post_id == '')
$post_id = FALSE;

//Query the database
query_posts( array (
'post_type' => 'portfolio',
'posts_per_page' => -1
)
);

?>

<ul id="portfolio-items" class="<?php if($magic_door) : ?>enabled<?php endif; ?> clearfix">

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<?php

//Get the terms
$terms = get_the_terms( get_the_ID(), 'skill-type' );

$output = '';

//If there are any terms then store them
if($terms) {
foreach ($terms as $term) {
$output .= 'term-'.$term->term_id.' ';
}
}

?>

<li id="portfolio-<?php the_ID(); ?>" class="<?php echo $output; ?>visible">

<!--BEGIN .hentry -->
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">

<a class="entry-link" href="<?php the_permalink(); ?>"></a>

<?php tz_featured_image(get_the_ID(), TRUE); ?>

<!--BEGIN .overlay -->

<div class="overlay">

<h3 class="entry-title"><?php the_title(); ?></h3>
<div class="seperator clearfix">
<!--<span class="line"></span>-->

</div>

<!--BEGIN .entry-content -->
<div class="entry-content">
<!-- <?php the_excerpt(); ?>-->
<!--END .entry-content -->
</div>

<div class="arrow"></div>
<!--END .overlay -->
</div>

<!--END .hentry-->
</div>

</li>

<?php endwhile; endif; ?>

</ul>

<!--END #primary .hfeed-->
</div>

<?php get_footer(); ?>


Si ca peut aider voici le fichier javascript dans lequel je pense ..est cree l'effet accordeon.




jQuery(document).ready(function($) { 

	$('html').removeClass('no-js');
 
/*-----------------------------------------------------------------------------------*/
/*	Superfish Settings - http://users.tpg.com.au/j_birch/plugins/superfish/
/*-----------------------------------------------------------------------------------*/

	$('#primary-menu')
		.superfish({
			delay: 200,
			animation: {opacity:'show', height:'show'},
			speed: 'fast',
			cssArrows: false,
			disableHI: true
		});

	
/*-----------------------------------------------------------------------------------*/
/*	Overlay States
/*-----------------------------------------------------------------------------------*/
	
	var portfolioItems = $('#portfolio-items li');
	var portfolioItemsEnabled = $('#portfolio-items.enabled li');
	var imageItems = $('.post-thumb');
	
	portfolioItems.hover( function () {
		$(this).not('.active, .invisible').find('.overlay').fadeIn(300);
	}, function () {
		$(this).not('.active, .invisible').find('.overlay').fadeOut(300);
	});
	
	imageItems.hover( function () {
		$(this).not('.active, .invisible').find('.overlay').fadeIn(150);
	}, function () {
		$(this).not('.active, .invisible').find('.overlay').fadeOut(150);
	});
	
/*-----------------------------------------------------------------------------------*/
/*	Portfolio Image Sorting
/*-----------------------------------------------------------------------------------*/

	var portfolioTerms = $('#portfolio-terms a');	
	var portfolioTermsAll = $('#portfolio-terms a.all');
	var magicDoor = $('#door-frame')
	var url = magicDoor.find('#magic-door').attr('data-url');
	
	if(magicDoor.hasClass('open') && $('#portfolio-items').hasClass('enabled')) {
		
		var postId = magicDoor.attr('data-id');
		
		portfolioItems.removeClass('active');
		$('#portfolio-' + postId).addClass('active');
		portfolioItems.not('.active').find('.overlay').css({ display: 'none' });
			
		tz_getPortfolio(postId);
	}
	
	/*	Sort it out! */
	
	function tz_sortPortfolios(cat) {

		if(portfolioItems.hasClass(cat)) {
			
			portfolioItems
				.not('.'+cat)
				.removeClass('visible')
				.addClass('invisible')
				.find('.hentry')
				.stop()
				.animate({
					opacity: 0
				}, 200);
			
			$('.'+cat)
				.addClass('visible')
				.removeClass('invisible')
				.find('.hentry')
				.stop()
				.animate({
					opacity: 1
				}, 200);
		}
		
	}
	
	
	portfolioTerms.click( function(e) { 
	
		var cat = $(this).attr('data-value')
		
		tz_sortPortfolios(cat);
		portfolioTerms.removeClass('active');
		$(this).addClass('active');
		
		e.preventDefault();

	});
	
	/*	When All is clicked */
	portfolioTermsAll.click( function(e) { 	
		
		portfolioItems
			.addClass('visible')
			.removeClass('invisible')
			.find('.hentry')
			.stop()
			.animate({
				opacity: 1
			}, 200);
			
		return false;
		
	});
	/*	When a portfolio item is clicked */
	
	portfolioItemsEnabled.click( function (e) {
		
		if(!$(this).hasClass('active') && $(this).hasClass('visible')) {
				
			portfolioItems.removeClass('active');
			$(this).addClass('active');
			portfolioItems.not('.active').find('.overlay').css({ display: 'none' });

			var postId = $(this).attr('id').split('portfolio-')[1];
			
			tz_getPortfolio(postId);
			
			
		}

	

		
		e.preventDefault();
		
	});
	function tz_changeNextPrev(postId) {
		
		var next = tz_getNext(postId)
		var prev = tz_getPrev(postId)
		
		$('#next-post').attr('data-id', next);
		$('#prev-post').attr('data-id', prev);
	}
	
	function tz_getPortfolio(postId, dontGet) {
		
		if(!dontGet)
			dontGet = false;
		
		var next = tz_getNext(postId);
		var prev = tz_getPrev(postId);
		
		if(dontGet == false) {
			
			var loader = $('#loading');
			
			loader.fadeIn(200);
			
			tz_closeDoor();
			
			magicDoor.find('#magic-door').load(url, {
				id: postId,
				next: next,
				prev: prev
			}, function() {
			
				tz_portfolioInit();
				tz_sliderInit();
				tz_openDoor();
				loader.fadeOut(200);
				
			});
			
		}
			
		$.scrollTo('#header', 500);
	}
	
	function tz_closeDoor() {
		
		if(magicDoor.height() != 0 ) {
			
			magicDoor.find('.inner').stop(true).animate({
				opacity: 0
			}, 200);
			
			magicDoor.stop(true).animate({
				height: 0
			}, 600, 'easeOutQuart');
		}
		
	}
	
	function tz_openDoor() {
		
		magicDoor.stop(true).animate({
			height: magicDoor.find('#magic-door').outerHeight()
		}, 1000, 'easeOutQuart', function () {//le temps que prend la magic door pour s ouvrir

			magicDoor.css({
				height: 'auto'
			});
	
		});
	}
	
	//tz_openDoor();
	
	function tz_getNext(postId) {
		
		var next = $('#portfolio-items li.visible').first().attr('id').split('portfolio-')[1];

		//has next var
		var hasNext = $('#portfolio-' + postId).next();
		
		//if there is a next object
		if(hasNext.length != 0) {
			
			while(hasNext.hasClass('visible') == false && hasNext.length != 0) {
				hasNext = hasNext.next();
			}
			
			if(hasNext.length != 0) {
				var next = hasNext
						.attr('id').split('portfolio-')[1];
			}
		}
		
		return next;
	}
	
	function tz_getPrev(postId) {
		
		var prev = $('#portfolio-items li.visible').last().attr('id').split('portfolio-')[1];

		//has next var
		var hasPrev = $('#portfolio-' + postId).prev();
		
		//if there is a next object
		if(hasPrev.length != 0) {
			
			while(hasPrev.hasClass('visible') == false && hasPrev.length != 0) {
				hasPrev = hasPrev.prev();
			}
			
			if(hasPrev.length != 0) {
				var prev = hasPrev
						.attr('id').split('portfolio-')[1];
			}
		}
		
		return prev;
	}
	
	//Initialize the portfolio
	function tz_portfolioInit() {

		
		$('#next-post, #prev-post').click( function() {

			var postId = $(this).attr('data-id');
			
			portfolioItems.removeClass('active');
			$('#portfolio-' + postId).addClass('active');
			portfolioItems.not('.active').find('.overlay').css({ display: 'none' });
			$('#portfolio-' + postId).find('.overlay').fadeIn(150);

			tz_getPortfolio(postId);
			
			return false;
			
		});
		
		
		$('.portfolio-close a').click( function() { 
			
			magicDoor.stop().animate({
				height: 0
			}, 600, 'easeOutQuart', function() {
				magicDoor.find('#slider').remove(); 
			});
			
			portfolioItems.find('.overlay').fadeOut(150);
			portfolioItems.removeClass('active');
			
			return false;
			
		});
	}
	
/*-----------------------------------------------------------------------------------*/
/*	Slider
/*-----------------------------------------------------------------------------------*/

	function tz_sliderInit() {
		
		if($().slides) {
			
			$(".slider").css({ height: 'auto' });
			
			$(".slider").slides({
				generatePagination: true,
				effect: 'fade',
				crossfade: true,
				autoHeight: true,
				bigTarget: true,
				preload: true,
				preloadImage: $("#loader").attr('data-loader')
			});
			
			$("#slider").slides({
				generatePagination: true,
				effect: 'fade',
				crossfade: true,
				autoHeight: true,
				bigTarget: true
			});
		}
		
	}
	
	tz_sliderInit();
	
/*-----------------------------------------------------------------------------------*/
/*	PrettyPhoto Lightbox
/*-----------------------------------------------------------------------------------*/
		function tz_fancybox() {
		
		if($().fancybox) {
			$("a.lightbox").fancybox({
				'transitionIn'	:	'fade',
				'transitionOut'	:	'fade',
				'speedIn'		:	300, 
				'speedOut'		:	300, 
				'overlayShow'	:	true,
				'autoScale'		:	false,
				'titleShow'		: 	false,
				'margin'		: 	10
			});
		}
	}
	
	tz_fancybox();
	
	$("#tabs").tabs();
	$(".tabs").tabs();

	

/*-----------------------------------------------------------------------------------*/
/*	Tabs and Toggles
/*-----------------------------------------------------------------------------------*/

	function tz_tabs_and_toggles() {
    	$(".toggle").each( function () {
    		if($(this).attr('data-id') == 'closed') {
    			$(this).accordion({ header: 'h4', collapsible: true, active: false  });
    		} else {
    			$(this).accordion({ header: 'h4', collapsible: true});
    		}
    	});
	}
	tz_tabs_and_toggles();
	
/*-----------------------------------------------------------------------------------*/
/*	All done!
/*-----------------------------------------------------------------------------------*/

});



Je ne sais pas si je dois faire ca en php ou en javascript..

Si quelqu'un peut m'aider ?
MERCI