oops..sorry, i have added that now.
<script type="text/javascript" src="js/mootools-1.2.3.1-more.js"></
script>
<script type="text/javascript" src="js/mootools-1.2.3-core-yc.js"></
script>
<script type="text/javascript">
window.addEvent('domready', function(){
var bar = $('the-bar'), slider = $('slider'), fx = new Fx.Reveal
(slider);
bar.addEvent('click', function(e){
if($(e.target) != slider) fx.toggle();
});
});
</script>
</head>
<body>
<div id="the-bar">click
<div id="slider">
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>
</div>
still its not working.
On Sep 9, 6:05 pm, Oskar Krawczyk <[email protected]> wrote:
> You have to wrap your code in:
> window.addEvent('domready', function(){
> // the code});
>
> ___
>
> Oskar Krawczykhttp://nouincolor.com
>
> On Wed, Sep 9, 2009 at 13:51, Deepali <[email protected]> wrote:
>
> > Thanks a lot for your help Oskar, this is something i wanted. but its
> > not working for me here is my html output source code
> > could you please tell me why its not working?
>
> > <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
> >www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> > <html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"
> > lang="en"><head>
>
> > <head>
> > <style>
> > #the-bar {
> > height: 30px;
> > border: solid 1px red;
> > position:absolute;
> > top: 300px;
> > left: 0;
> > width: 99%;
> > }
>
> > #slider {
> > border: solid 1px green;
> > width: 300px;
> > position: absolute;
> > bottom: 30px;
> > overflow: hidden;
> > display: none;
> > }
>
> > </style>
> > <script type="text/javascript" src="js/mootools-1.2.3.1-more.js"></
> > script>
>
> > <script type="text/javascript" src="js/mootools-1.2.3-core-yc.js"></
> > script>
> > <script type="text/javascript">
> > var bar = $('the-bar'), slider = $('slider'), fx = new Fx.Reveal
> > (slider);
>
> > bar.addEvent('click', function(e){
> > if($(e.target) != slider) fx.toggle();
> > });
> > </script>
> > </head>
> > <body>
> > <div id="the-bar">click
> > <div id="slider">
>
> > 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>
> > </div>
> > </body>
> > </html>
>
> > On Sep 9, 5:43 pm, Oskar Krawczyk <[email protected]> wrote:
> > > Small update:http://mooshell.net/6sUSE/1
>
> > > ___
>
> > > Oskar Krawczykhttp://nouincolor.com
>
> > > On Wed, Sep 9, 2009 at 12:21, Oskar Krawczyk <[email protected]
> > >wrote:
>
> > > >http://mooshell.net/6sUSE/
>
> > > > ___
>
> > > > Oskar Krawczyk
> > > >http://nouincolor.com
>
> > > > On Wed, Sep 9, 2009 at 11:49, Deepali <[email protected]> wrote:
>
> > > >> I have seen those effect before i posted here. actually if you can see
> > > >> both the effects are either vertical or horizontal i need when i click
> > > >> on the image it should open upward direction of that link like the
> > > >> site has done. could you please point me right direction for how can i
> > > >> do that?
>
> > > >> On Sep 9, 3:07 pm, Oskar Krawczyk <[email protected]> wrote:
> > > >> >http://en.wikipedia.org/wiki/Ping
> > > >> > Regarding
> > > >> > the effect you're looking for– it's pretty straight forward script,
> > I
> > > >> > doubt there's a premade "library" to do that. As I mentioned before,
> > > >> > you can use Fx.Slide,
> > > >> > Fx.Morph or Fx.Reveal/Dissolve.
>
> > > >> > You can start by checking the demo out:
> > > >>http://demos.mootools.net/Fx.Slide
>
> > > >> > O.
> > > >> > ___
>
> > > >> > Oskar Krawczykhttp://nouincolor.com
>
> > > >> > On Wed, Sep 9, 2009 at 10:40, Deepali <[email protected]> wrote:
>
> > > >> > > I am sorry i just not getting what you are trying to say. i can
> > see
> > > >> > > that site properly.
>
> > > >> > > where is this $ping thing?
>
> > > >> > > On Sep 9, 1:03 pm, Oskar Krawczyk <[email protected]>
> > wrote:
> > > >> > > > Oddly:
>
> > > >> > > > $ ping fresheventure.com
> > > >> > > > ping: cannot resolve fresheventure.com: Unknown host
>
> > > >> > > > On 9 Sep 2009, at 08:52, Deepali wrote:
>
> > > >> > > > > Thanks for your reply Oskar Krawczyk,
>
> > > >> > > > > that page is coming properly. wait till its get fully loaded.
> > you
> > > >> can
> > > >> > > > > see facebook like notification bar where you ll get recent
> > posts.
>
> > > >> > > > > yeah may be the link is useful. but i wanted to see if someone
> > has
> > > >> > > > > used this kind of effect or not.
>
> > > >> > > > > has anyone?
>
> > > >> > > > > On Sep 9, 12:38 pm, Oskar Krawczyk <[email protected]>
> > > >> wrote:
> > > >> > > > >> The link doesn't work (for me at least).
>
> > > >> > > > >> What I'm guessing, you're looking for is:
> > > >>http://mootools.net/docs/
> > > >> > > > >> more/Fx/Fx.Slide
>
> > > >> > > > >> O.
>
> > > >> > > > >> On 9 Sep 2009, at 08:23, Deepali wrote:
>
> > > >> > > > >>> Hello,
>
> > > >> > > > >>> Can anyone has worked on hide and show div something like
> > this
>
> > > >> > > > >>>http://www.fresheventure.com/1719/wibiya-facebook-toolbar/
>
> > > >> > > > >>> When you click on recent post( in toolbar) it opens up
> > > >> vertically. i
> > > >> > > > >>> was searching for the similar effect. can anyone tell me any
> > > >> > > > >>> resources
> > > >> > > > >>> for this effect?
>
> > > >> > > > >>> Thanks in advance.