Dúvidas accordion vertical

22/02/2013

1

Bom dia pessoal, estou com o seguinte problema ... sou desenvolvedor php e no momento estou trabalhando ( apenas ) no front e idéias pra um site ... quem puder dar uma olhada é fernandesweb.com/prescon ... na página "produtos" existem submenus em que contem um accordion vertical exibindo módulos. Minha dúvida é que, como bom backend ... peguei um pronto da net e preciso fazer com que, ao clicar pela 2° vez no módulo ele feche ( e hoje só abre mas não fecha ) ... alguem poderia dar uma força nisso? Talvez seja uma linha só em que tenha que se reverter de true pra false ... ou play stop ... eu não faço idéia ... mas alguem poderia ajudar?

Grande abraço a todos.
Responder

Posts

22/02/2013

Joel Rodrigues

Você poderia posta o código que está usando par ao accordion? Assim facilitaria para darmos alguma opinião.
Abraço.
Responder

22/02/2013

Paulo Henrique

Com certeza Joel,

/*********************
//* jQuery Multi Level CSS Menu #2- By Dynamic Drive: http://www.dynamicdrive.com/
//* Last update: Nov 7th, 08': Limit # of queued animations to minmize animation stuttering
//* Menu avaiable at DD CSS Library: http://www.dynamicdrive.com/style/
*********************/

//Update: April 12th, 10: Fixed compat issue with jquery 1.4x

//Specify full URL to down and right arrow images (23 is padding-right to add to top level LIs with drop downs):
var arrowimages={down:['downarrowclass', '', 23], right:['rightarrowclass', '']}

var jqueryslidemenu={

animateduration: {over: 200, out: 100}, //duration of slide in/ out animation, in milliseconds

buildmenu:function(menuid, arrowsvar){
	jQuery(document).ready(function($){
		//console.log(navigator.userAgent);
		var $mainmenu=$("#"+menuid+">ul")
		var $headers=$mainmenu.find("ul").parent()
		$headers.each(function(i){
			var $curobj=$(this)
			var $subul=$(this).find('ul:eq(0)')
			this._dimensions={w:this.offsetWidth, h:this.offsetHeight, subulw:$subul.outerWidth(), subulh:$subul.outerHeight()}
			this.istopheader=$curobj.parents("ul").length==1? true : false
			$subul.css({top:this.istopheader? this._dimensions.h+"px" : 0})
			/*$curobj.children("a:eq(0)").css(this.istopheader? {paddingRight: arrowsvar.down[2]} : {}).append(
				'<img src="'+ (this.istopheader? arrowsvar.down[1] : arrowsvar.right[1])
				+'" class="' + (this.istopheader? arrowsvar.down[0] : arrowsvar.right[0])
				+ '" style="border:0;" />'
			)*/
			if( ( navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i)) || (navigator.userAgent.match(/ndroid/i)) ){
			    $('html').click(function(e){
				if( !$(e.target).parents().andSelf().is('#'+menuid) )
				    $('#'+menuid+' ul ul').slideUp(jqueryslidemenu.animateduration.out)
			    });
			    $curobj.click(function(e){

				var $targetul=$(this).children('ul:eq(0)')
				this._offsets={left:$(this).offset().left, top:$(this).offset().top}
				var menuleft=this.istopheader? 0 : this._dimensions.w

				//console.log( $(this).find('ul:eq(0)') );
				$(this).parent('ul').children('li').children('ul').hide()

				menuleft=(this._offsets.left+menuleft+this._dimensions.subulw>$(window).width())? (this.istopheader? -this._dimensions.subulw+this._dimensions.w : -this._dimensions.w) : menuleft
				if ($targetul.queue().length<=1) //if 1 or less queued animations
				    $targetul.css({left:menuleft+1+'px', width:this._dimensions.subulw+'px'}).slideDown(jqueryslidemenu.animateduration.over)

				if( !this.istopheader )
				    return false;
			    });
			}else{
			    $curobj.hover(function(e){
				var $targetul=$(this).children("ul:eq(0)")
				this._offsets={left:$(this).offset().left, top:$(this).offset().top}
				var menuleft=this.istopheader? 0 : this._dimensions.w
				menuleft=(this._offsets.left+menuleft+this._dimensions.subulw>$(window).width())? (this.istopheader? -this._dimensions.subulw+this._dimensions.w : -this._dimensions.w) : menuleft
				if ($targetul.queue().length<=1) //if 1 or less queued animations
				    $targetul.css({left:menuleft+1+"px", width:this._dimensions.subulw+'px'}).slideDown(jqueryslidemenu.animateduration.over)
			    }, function(e){
				var $targetul=$(this).children("ul:eq(0)")
				$targetul.slideUp(jqueryslidemenu.animateduration.out)
			    });
			    $curobj.click(function(){
				$(this).children("ul:eq(0)").hide()
			    });
			}
		}) //end $headers.each()
		$mainmenu.find("ul").css({display:'none', visibility:'visible'})
	}) //end document.ready
}
}

//build menu with ID="myslidemenu" on page:
jqueryslidemenu.buildmenu("strangemenu", arrowimages)


Essa página me parece ser a .js responsável por este abre e fecha da aba.
Responder

22/02/2013

Joel Rodrigues

Vixe, assim fica ruim pra caramba de ler. Você tem o link onde baixou esse plugin?
Aí eu vejo se consigo testar aqui.
Responder

22/02/2013

Paulo Henrique

Então Joel,

Se acessar fernandesweb.com/prescon na aba produtos > saude ( por exemplo ) tem o slide vertical lá ... aí da pra ter idéia de como está, e de o que me falta ( fechar ao clicar novamente ).
Responder

22/02/2013

Joel Rodrigues

Certo, certo, eu vi a página funcionando. Mas você deve ter baixado esse plugin em algum lugar, certo?
Se você tiver o link, fica mais fácil de fazermos download do plugin e fazer alguns testes.
Responder
×
+1 DevUP
Acesso diário, +1 DevUP
Parabéns, você está investindo na sua carreira