SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Problems with fx.Slide (mootools)

    Hi guys,

    I'm trying desperately to use fx.Slide on a program I'm currently creating, but I'm not having much luck.

    My code currently looks as follows (just test code for now):

    Code JavaScript:
    	<script type="text/javascript" src="js/build.js"></script>
     
    	<script type="text/javascript">
    		window.addEvent('domready', function(){
    			var mySlider = new Fx.Slide('test', {duration: 500});
    		}); 
    	</script>
     
    </head>
     
    <body>
     
    <a href="#" onClick="mySlider.toggle()">toggle</a>
     
    <div id="test">
    	Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore
    	et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
    	aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
    	cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa
    	qui officia deserunt mollit anim id est laborum.
    </div>
    Annoyingly, when I click on 'toggle' it throws up a Javascript error:
    Code JavaScript:
    mySlider is not defined onclick(click clientX=0, clientY=0)
    ... and yet, if I simply add mySlider.toggle() into the Javascript area at the top underneath where I defined var mySlider it works just fine.

    I've tested the onClick statement works with an alert, and that's fine.

    I'm really confused Does anyone have an idea of what I'm doing wrong please? Thank you

  2. #2
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    When you use the var keyword, the variable is declared local in scope. You can do one of two things:
    1) Make the variable global. Simply remove the var keyword to do this.
    2) Make the local variable available to the event-handler. To do this, you need to attach an event-handler to the onclick event of the anchor element, using addEvent().

    The latter way is more somplicated, but generally considered the best way. For small programs, you should be fine, using a global though.

  3. #3
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Oh man, you're such a star, thank you so much! For now I've just removed the word var and it's working perfectly, will look into the second option a little more once this page is complete and I have a bit more time. Tyvm!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •