(opgelost) Java/Jquery Slide effect

Nederlandse ondersteuning voor CMS Made Simple

Moderator: velden

Post Reply
pasmaskas
Power Poster
Power Poster
Posts: 509
Joined: Tue Nov 29, 2011 10:42 am

(opgelost) Java/Jquery Slide effect

Post 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
Last edited by pasmaskas on Tue Nov 05, 2013 1:41 pm, edited 1 time in total.
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3497
Joined: Mon Nov 28, 2011 9:29 am

Re: Java/Jquery Slide effect

Post 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.
pasmaskas
Power Poster
Power Poster
Posts: 509
Joined: Tue Nov 29, 2011 10:42 am

Re: Java/Jquery Slide effect

Post 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
Post Reply

Return to “Dutch - Nederlands”