020 555 1111
  • Old fashion, modular, procedural PHP plus some scaffolding techniques to allow it to mimic MVC simplicity.
  • A quick reference to help you find in PHP maze what needs to be done and how to do it.
  • Learn a PHP Object Oriented Programming by building a live discussion forum application.
  • MVC - Model View Controller - real life, easy reference and application.
This product has options, take a look at them and select ones you like the most.
Options are displayed under image section.

Open/ close list item and slide to opened element
[in: jQuery example]

Let's say you have a collapsed list of element.

You want to open such list and slide to element you open. For that you may adjust code found here.

Live example (open close list and slide to opened element) can be found e.g. here.

Open, close collapsed elements: see another example here.

 

$(document).ready(function () {
    
    //make sure list elements are closed on page load
    $('li').each(function() {
        $(this).children('ul,li').css('display','none');
    });

    //on-click close, or if closed: open
    $(".slider").click(function () {
        
        //fetch id of selected (clicked) element
        var selected = $(this).attr('id');
        
        //sliding (opening) element
        var elem = $('#slider_' + selected).children('ul,li');
        
        //hide - show replies
        if (elem.is(":visible")) {
            elem.slideUp("slow");
        } else {
            elem.slideDown("slow");
            
            //slide to selected element
            var speed=900; //animation speed
            var easing="easeInOutExpo"; //easing type

            var scrollToPoint = $('#' + selected).offset().top;
            scrollToPoint = +scrollToPoint; //make sure it is a number
            scrollToPoint = scrollToPoint - 25;
            
            if($.browser.webkit){ //webkit browsers do not support animate-html
                $("body").stop().animate({
                    scrollTop: scrollToPoint
                    }, speed, easing);
            } else {
                $("html").stop().animate({
                    scrollTop: scrollToPoint
                    }, speed, easing);
            }
         
        }
        
        return false;
        
    });
	
});