Javascript – Click list element to load HTML page animation

Javascript novice here. I am working on a piece of code provided here –

I’m trying to modify the behavior so that instead of just zooming in the list element when clicked, it should load a different html page completely.

$(document).ready(function() {
    var $box = $('.box');

    $('.metro li').each(function() {
        var color = $(this).css('backgroundColor');
        var content = $(this).html();
        $(this).click(function() {
            $box.css('backgroundColor', color);

        $('.close').click(function() {
            $box.css('backgroundColor', 'transparent');

Can anyone point me to the right direction?

Source: css

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.