ouch and I forogt to take out the console.debug.... I need to be more
careful.
On Wed, May 13, 2009 at 4:33 PM, nwhite <changereal...@gmail.com> wrote:
> slight typo in usage:
>
> new Fx.Slide2(el,{outHeight : 40});
>
> should be:
>
> new Fx.Slide(el,{outHeight : 40});
>
>
>
> On Wed, May 13, 2009 at 4:20 PM, Paul Hunt <paulhun...@gmail.com> wrote:
>
>> Nathan,Extremely well done. I appreciate the effort and will implement
>> this change immediately. Thanks.
>>
>> On Wed, May 13, 2009 at 4:15 PM, nwhite <changereal...@gmail.com> wrote:
>>
>>>
>>> Well your use case is a bit beyond the scope of Fx.Slide but Mootools
>>> architecture makes it easy to adapt for your own solution:
>>>
>>> // start is the brains that all actions are routed through in
>>> Fx.Slide so we need to modify it. All I did was copy the method from
>>> Fx.Slide
>>> Fx.Slide.implement({
>>>
>>> options : {
>>> outHeight: 0 // a new option we can set to control the
>>> action you want
>>> },
>>>
>>> start : function(how,mode){
>>> console.debug('override');
>>> if (!this.check(how, mode)) return this;
>>> this[mode || this.options.mode]();
>>> var margin = this.element.getStyle(this.margin).toInt();
>>> var layout = this.wrapper.getStyle(this.layout).toInt();
>>> var caseIn = [[margin, layout], [0, this.offset]];
>>> var caseOut = [[margin, layout],
>>> [-this.offset+this.options.outHeight, this.options.outHeight]]; // added
>>> changes here
>>> var start;
>>> switch (how){
>>> case 'in': start = caseIn; break;
>>> case 'out': start = caseOut; break;
>>> case 'toggle': start = (layout == 0) ? caseIn :
>>> caseOut;
>>> }
>>> return this.parent(start[0], start[1]);
>>> }
>>> });
>>>
>>> Usage is the same just pass the new option to get desired results:
>>>
>>> new Fx.Slide2(el,{outHeight : 40});
>>>
>>> The nice part about this new implementation is Fx.Slide now has more
>>> functionality but at the same time doesn't break the interface, the default
>>> remains exactly like old behavior.
>>>
>>>
>>> Nathan
>>>
>>>
>>>
>>>
>>> On Wed, May 13, 2009 at 2:54 AM, Paul <paulhun...@gmail.com> wrote:
>>>
>>>>
>>>> Hi Daniel,
>>>> I also thought about creating multiple divs that would slide in and
>>>> out to achieve what I wanted but in the end, and because of the sheer
>>>> number of panels and sliding menus I would have to maintain "complete"
>>>> events for, I decided against it. I think your explanation proves my
>>>> point on the confusion factor =)
>>>>
>>>> So my solution, the Yahoo library (http://developer.yahoo.com/yui/). I
>>>> already use quite a few of their components so it was not surprise
>>>> that they had exactly what I was looking for.
>>>>
>>>> For a really simple example check out:
>>>> http://blog.jc21.com/staging/slideandhide.php
>>>>
>>>> The trick is in the line:
>>>> var anim = new YAHOO.util.Anim('slider2',{height:{to:0}},
>>>> 1,YAHOO.util.Easing.easeIn);
>>>>
>>>> change {height:{to:0}} to {height:{to:40}} and the slideout will
>>>> remain open 40 pixels. Perfect!
>>>>
>>>> Good luck,
>>>> Paul
>>>>
>>>>
>>>> On May 13, 2:36 am, Annis McKenzie <annismcken...@googlemail.com>
>>>> wrote:
>>>> > I want to achieve something similar to this and the only way I can
>>>> > think of, is creating another container where your menu is, so that
>>>> > this div contains all the menu items that you want to be visible after
>>>> > slideIn(). Sliding this one out also doesn't slide out the menu
>>>> > portion to open it again. Man, that sounds like I couldn't understand
>>>> > it myself:
>>>> >
>>>> > <div>
>>>> > <div id="menu-item-container"></div> <== this one slides in and out
>>>> > and contains the menu items you want to show when opening the menu
>>>> > <div id="top-menu"></div> <== this one contains the buttons to slide
>>>> > the menu item container in and out
>>>> > </div>
>>>> >
>>>> > I Hope you get what I mean. :) Post back, if there's anything else.
>>>> >
>>>> > Cheers, Daniel
>>>> >
>>>> > On May 12, 6:30 pm, Paul <paulhun...@gmail.com> wrote:
>>>> >
>>>> > > Hello,
>>>> > > I am trying to get a visual display to behave the way I want using
>>>> > > Fx.Slide but I am having some problems.
>>>> >
>>>> > > Here's the effect that Im trying to achieve. I have a "Main" div and
>>>> > > then my "Menu" div underneath that. When i click an image I want the
>>>> > > "Menu" div to slideIn(). No problem so far.
>>>> >
>>>> > > The problem comes when I slideOut(). When I slide my "Menu" div out
>>>> I
>>>> > > actually want to keep the bottom 40px of it visible...i.e. I only
>>>> want
>>>> > > to partially slideOut() or slideOut() a certain height.
>>>> >
>>>> > > How can I do this?
>>>> >
>>>> > > Regards,
>>>> > > Paul
>>>>
>>>
>>>
>>
>
