Question

I wrote code in which I call jQuery.noConflict(); many times.
How can reduce jQuery.noConflict(); presence since I think it’s not good that the statement is repeated several times

$glob = jQuery.noConflict();

            /* functions to run when content loads */
            $glob(document).ready(function(){

                var ht = $glob(window).height();

                $glob('.content').css({
                    'height': ht,
                    'min-height': ht
                });

                $glob('#page').css({
                    'top':-ht
                });
            });


            /* functions to run when page loads */
            function animateHorizontal2id(id,msg){ //the id to animate, the easing type



                var $a = jQuery.noConflict(); // defined to remove jquery conflict error
                var animSpeed=2000; //set animation speed
                var page= $a("#page"); //define the page to move

                var ht = $a(window).height();



                //do the animation

                var archPos = $a(id).position().left;           

                $a('#architecture').css({
                    'left': archPos
                });



                page.stop().animate({"left": -($a(id).position().left)}, animSpeed

                                    );

                    $a('#page').css({
                        'top': -ht
                    });
                //}

            }
            function animateVertical2id(id,msg) {

                var $arct = jQuery.noConflict(); // defined to remove jquery conflict error
                var animSpeed=2000; //set animation speed
                var page= $arct("#page"); //define the page to move
                //do the animation

                page.stop().animate({"top": -($arct(id).position().top)}, animSpeed);

            }

            function animate2Home(id,msg) {
                var $home = jQuery.noConflict(); // defined to remove jquery conflict error

                var archPos = $home(id).position().left;            

                var ht = $home(window).height();
                $home('#page').css({
                    'top': -ht
                });

                $home('#architecture').css({
                    'left': archPos
                });


                var animSpeed=2000; //set animation speed
                var page= $home("#page"); //define the page to move
                //do the animation
                page.stop().animate({"left": -($home(id).position().left)}, animSpeed);
            }

Answer 1

The point of .noConflict() is to re-assign jQuery to a different global once and then reference your new global where you need to. Your code could easily be written like this:

$glob = jQuery.noConflict();
/* functions to run when content loads */
$glob(document).ready(function () {
    var ht = $glob(window).height();
    $glob('.content').css({
        'height': ht,
        'min-height': ht
    });
    $glob('#page').css({
        'top': -ht
    });
});
/* functions to run when page loads */
function animateHorizontal2id(id, msg) { //the id to animate, the easing type
    var animSpeed = 2000; //set animation speed
    var page = $glob("#page"); //define the page to move
    var ht = $glob(window).height();
    //do the animation
    var archPos = $glob(id).position().left;
    $glob('#architecture').css({
        'left': archPos
    });
    page.stop().animate({
        "left": -($glob(id).position().left)
    }, animSpeed);
    $glob('#page').css({
        'top': -ht
    });
    //}
}

function animateVertical2id(id, msg) {
    var animSpeed = 2000; //set animation speed
    var page = $glob("#page"); //define the page to move
    //do the animation
    page.stop().animate({
        "top": -($glob(id).position().top)
    }, animSpeed);
}

function animate2Home(id, msg) {
    var archPos = $glob(id).position().left;
    var ht = $glob(window).height();
    $glob('#page').css({
        'top': -ht
    });
    $glob('#architecture').css({
        'left': archPos
    });
    var animSpeed = 2000; //set animation speed
    var page = $glob("#page"); //define the page to move
    //do the animation
    page.stop().animate({
        "left": -($glob(id).position().left)
    }, animSpeed);
}

That said, I really like Allan Kimmer Jensen‘s solution, although I would write it like so:

(function ($) {
    // You can use $ safely in here with no conflicts.
}(jQuery.noConflict()))