Collect small JS from webpage to one big JS

Question

This is sample JavaScript code:

/* Email me Animation */
      $(function() {
            var offset = $("#sidebar").offset();
            var topPadding = 0;
            $(window).scroll(function() {
                if ($(window).scrollTop() > offset.top) {
                    $("#sidebar").stop().animate({
                        marginTop: $(window).scrollTop() - offset.top + topPadding
                    });
                } else {
                    $("#sidebar").stop().animate({
                        marginTop: 0
                    });
                };
            });
        });

        */-->
$(document).ready(function(){

    $('#page_effect').fadeIn(2000);

});


    /* Toggle */
    $(document).ready(function(){
        $('a.showHideButton').click(function(){
            $('div[data-something=' + $(this).data('something') + ']').toggle(500);
        });
    });


    /* Move top */

    $(function() {
        $(window).scroll(function() {
            if($(this).scrollTop() != 0) {
                $('#backtotop2').fadeIn();
            } else {
                $('#backtotop2').fadeOut();
            }
        });

        $('#backtotop2').click(function() {
            $('body,html').animate({scrollTop:0},1200);
        });
    });


    /* Menu animation */
    var jump=function(e)
    {
           e.preventDefault();
           var target = $(this).attr("href");
           $('html,body').animate(
           {
                   scrollTop: $(target).offset().top
           },2000,function()
           {
                   location.hash = target;
           });

    }

    $(document).ready(function()
    {
           $('a[href*=#]').bind("click", jump);
           return false;
    });


    /* Menu Appear Animation */
    $(function() {
        $(window).scroll(function() {
            if($(this).scrollTop() != 0) {
                $('#menuAppear').fadeIn();
            } else {
                $('#menuAppear').fadeOut();
            }
        });
    });

I have like 10 small JavaScripts, is it possible way to collect the in one JS file and load on the page,

Like use:

<script src="js/jsScript.js"></script>

Insted of writing ALLLLLL this small JS on every single page.

Can we have multiple `$(document).ready(function()` for a single page? — Praveen, Jun 21 '13 at 08:47
Just need to collect all small piece of JS and replace with something which will load all this small JS. — Denis S, Jun 21 '13 at 08:50
@DenisS deleted my answer, try again. glad you worked out that " — Reyno, Jun 21 '13 at 09:08

score 0 · Answer 1 · answered May 21 '18 at 18:12

0

This should do the trick, and more, it uses nodeJS and npm to build bundles for js and css. So you can split your code in many smaller files.

answered May 21 '18 at 18:12

DullaisD

1
2

Collect small JS from webpage to one big JS

1 Answers1