CSS, Javascript : Hide, show content with sliding effect

Posted on 2009-02-19
Last Modified: 2012-05-06
I am looking for a way to hide and slow content on a page with a toggle effect to slide the content. Sliding effect is important.

I looked at many solutions online but an not able to get the sliding effect. I donot want to use jquery as i believe the java runtime is needed for that.

can somebody help with code.

Question by:nirisan
    LVL 5

    Expert Comment

    MooTools JS framework has this effect. You need no extras but Mootools, which is very lightweight.

    This is Slide demo:

    This is Accordion demo:


    Author Comment

    But im not able to install mootools on the server.

    I am looking for a solution with CSS and javascript.
    LVL 13

    Accepted Solution


    Featured Post

    IT, Stop Being Called Into Every Meeting

    Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

    Join & Write a Comment

    Suggested Solutions

    So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
    Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
    In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
    In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

    746 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    18 Experts available now in Live!

    Get 1:1 Help Now