Page 1 of 1

(opgelost) Java/Jquery Slide effect

Posted: Tue Nov 05, 2013 10:33 am
by pasmaskas
Beste CMSMS leden,

Voor mijn vriendin heb ik bezig met een website en een bijpassende webapp. Nu gebruik ik een scripje en een paar css regels om de menus te verbergen en te laten zien.

Script:

Code: Select all

 	
function unhide(divID) {
 		var item = document.getElementById(divID);
 		if (item) {
 			item.className=(item.className=='hidden')?'unhidden':'hidden';
 		}
 	}
CSS:

Code: Select all

.hidden{display:none;}
.unhidden{display:block;}
HTML:

Code: Select all

 <a href="javascript:unhide('menu');">Laat menu zien</a>
De div die verborgen moet zijn krijgt de class "hidden" als je dan op de link drukt unhidde hij de div die eerst hidden was.

Dit werkt allemaal prima alleen ik zou er een soort slide effect in willen. Weet iemand hoe ik dat voor elkaar krijg? Ik heb al wat dingen geprobeert maar dan klappen alle uitschuif menus open en dat is nie de bedoeling. Dit script gebruik ik namelijk ook om de zoek en share menutjes te verbergen en te laten zien.

Hier een link naar de webapp demo die nog niet in cmsms zit omdat ik eerst het uiterlijk goed wil hebben.
http://webapp.pmkmedia.nl/demo/nomenu

Gr Pascal

Re: Java/Jquery Slide effect

Posted: Tue Nov 05, 2013 11:51 am
by velden
jQuery biedt daar een aantal functies voor. Tevens kun je daarmee ook per link/button aangeven welk menu/element moet uit-/inklappen.

Heel veel informatie over te vinden.

Re: Java/Jquery Slide effect

Posted: Tue Nov 05, 2013 12:48 pm
by pasmaskas
Ik heb het al gevonden:

Code: Select all

    $(document).ready(function(){
		$('a.menubutton').click(function () {
			$("#menu").animate({width:'toggle'},250);
		});
	});
De link die de div moet openen geef je een class b.v menubutton en die opent dan de div met id menu