Question

Ok this is my issue if anyone can help, please.

I have a href that div id to switch content – I would like to add another document ready function javascript without conflicting with make tab I have already.

Example of make tab already:

<script type="text/javascript">
{literal}
$(document).ready(function(){
    function makeTabs(selector) {
        var tabContainers = $(selector + ' > div');
        tabContainers.removeClass("selected").filter(':first').addClass("selected");

        galleryRendered = false;
        $(selector + ' > ul a').click(function () {
            tabContainers.removeClass("selected");
            tabContainers.filter(this.hash).addClass("selected");
            $(selector + ' > ul a').removeClass('selected');
            $(this).addClass('selected');

            if (this.hash == '#Pictures' && !galleryRendered)
            {
                var galleries = $('.pictures > .ad-gallery').adGallery({
                    effect : 'slide-hori',
                    enable_keyboard_move : true,
                    cycle : true,
                    animation_speed : 400,
                    slideshow: {
                        enable: false
                    },
                    callbacks: {
                        init: function() {
                            this.preloadImage(0);
                            this.preloadImage(1);
                            this.preloadImage(2);
                        }
                    }
                });
                galleryRendered = true;
            }
            if (this.hash == '#OnTheMap') document.getElementById("Map").map.onContainerChanged();

            return false;
        }).filter(':first').click();
    }
    makeTabs('.tabs');
});
{/literal}
</script>

Want to create a second one so I can create tabs inside of an existing div id area/content to switch from photo to video to youtube.

<div class=".tabs"><ul><li><a href="#photo">[[Photo]]</a></li><li><a href="#tube">[[Youtube]]</a></li><li><a href="#vid">[[Video]]</a></li></ul><div id="photo">Test</div><div id="tube">Test</div><div id="vid">Test</div></div>

This will be inside a div id that already exist that uses the first tab creator shown above.

Answer 1

In jQuery you just have to do this:

$(function(){
  // code here
});

$(function(){
  // more code here
});

Every function declared like this will be executed on domready.