Run Slideshow Inside an If Statement

So I am trying to run two different slideshows on one page depending on the size of the window. I have made the slideshows with edge animate and I now have the issue of not being able to run both of the scripts. When I try to both of them become invisible.

Here is what I have so far:

<script type="text/javascript" src="http://ift.tt/JJs6bh">
</script>
<script type="text/javascript">

$(window).resize(function(){
    var winW = $(window).width()
    var menu = $('#clear')
    if(winW < 768){
        $('#clear').hide();
         }
    else {
         $('#clear').show();
}
 });

 </script>

 <script>
     var custHtmlRoot="edgeanimate_assets/Slideshow/Assets/"; 
     var script = document.createElement('script'); 
     script.type= "text/javascript";
script.src = custHtmlRoot+"edge_includes/edge.6.0.0.min.js";
    var head = document.getElementsByTagName('head')[0], done=false;
    script.onload = script.onreadystatechange = function(){
         if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
             done=true;
             var opts ={
     scaleToFit: "both",
     centerStage: "horizontal",
     minW: "0px",
     maxW: "800px",
     width: "600px",
     height: "468px"
};
        opts.htmlRoot =custHtmlRoot;
        AdobeEdge.loadComposition('Slideshow', 'EDGE-15997909', opts,
        {"dom":{}}, {"dom":{}});        
        script.onload = script.onreadystatechange = null;
        head.removeChild(script);
    }
};
head.appendChild(script);
</script>

<style>
    .edgeLoad-EDGE-15997909 { visibility:hidden; }
</style>

<script>
    var custHtmlRoot="edgeanimate_assets/Swipe_Slideshow/Assets/"; 
    var script = document.createElement('script'); 
    script.type= "text/javascript";
script.src = custHtmlRoot+"edge_includes/edge.6.0.0.min.js";
    var head = document.getElementsByTagName('head')[0], done=false;
    script.onload = script.onreadystatechange = function(){
        if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
            done=true;
            var opts ={
    scaleToFit: "both",
    centerStage: "horizontal",
    minW: "0px",
    maxW: "600px",
    width: "600px",
    height: "400px"
};
            opts.htmlRoot =custHtmlRoot;
            AdobeEdge.loadComposition('Swipe_Slideshow', 'EDGE-23145440', opts,
            {"dom":{}}, {"dom":{}});        
            script.onload = script.onreadystatechange = null;
            head.removeChild(script);
        }
    };
        head.appendChild(script);
    </script>

    <style>
            .edgeLoad-EDGE-23145440 { visibility:hidden; }
    </style>

</head>

Is there a way I can run these scripts within the resize if else function? And if so how do I do that?