1つのhtmlドキュメントで外部jsファイルとjqueryを2回使用することは可能ですか？最初のものを実行していますが、2回目に呼び出すと機能しません。また、外部jsは、InternetExplorerで開いたときに機能しません。
<!DOCTYPE html >
<html>
<head>
<link href="css/stylesheetelaine.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
<script type="text/javascript" src="js/script2.js"> </script>
<script src="js/jQuery/jquery.monte.js"></script>
<meta charset="utf-8">
<title>Gallery</title>
</head>
<body>
<div id="wrapper">
<div id="title">
<h1><a href="index.html"><img src="img/elaine4.png" width="517" height="185" alt="elaine cullinan"></a><img src="img/elainefilligree.png" width="235" height="251" alt="elaine"></h1>
<div id="nav">
<ul id>
<li><a href="about.html" title="About">About</a></li>
<li><a href="tattoo.html" title="Tattoo">Tattoo</a></li>
<li><a href="makeup.html" title="Make Up">Make Up</a></li>
<li><a href="gallery.html" title="Gallery">Gallery</a></li>
<li><a href="contact.html" title="Contact">Contact</a></li>
</ul>
</div>
</div>
<div id="gallback">
<h2> Tattoos </h2>
<div id="gallerywrap">
<div id='example1' class='container'>
<img src="img/tattoogallery/outlineariel.jpg" alt='Zombie Ariel.'/>
<img src="img/tattoogallery/horsecar.jpg" alt='Elaine tattooing'/>
<img src="img/tattoogallery/2small.jpg" alt='Two Small Tattoos'/>
<img src="img/tattoogallery/clown.jpg" alt='Clown'/>
<img src="img/tattoogallery/lightsabers.jpg" alt='Finger Lightsabers'/>
<img src="img/tattoogallery/flouder.jpg" alt='Flounder'/>
<img src="img/tattoogallery/grenade.jpg" alt='Grenade'/>
<img src="img/tattoogallery/colourcherryblossom.jpg" alt='Colour Cherry Blossom'/>
<img src="img/tattoogallery/13.jpg" alt='13'/>
<img src="img/tattoogallery/mechwing.jpg" alt='Mechanical Wing'/>
<img src="img/tattoogallery/qotsa.jpg" alt='QOTSA'/>
<img src="img/tattoogallery/horsecartatt.jpg" alt='Carousel'/>
<img src="img/tattoogallery/lovefinger.jpg" alt='Love finger tatt'/>
<img src="img/tattoogallery/hakun.jpg" alt='Hakuna Matata'/>
<img src="img/tattoogallery/romannum.jpg" alt='Roman Numerals'/>
<img src="img/tattoogallery/slayer.jpg" alt='Slayer'/>
<img src="img/tattoogallery/shamrock.jpg" alt='Shamrock'/>
<img src="img/tattoogallery/scriptarm.jpg" alt='Script'/>
<img src="img/tattoogallery/skull.jpg" alt='Skull'/>
<img src="img/tattoogallery/wristfoot.jpg" alt='Wrist and Foot Tatts'/>
<img src="img/tattoogallery/zombieariel.jpg" alt='Zombie Ariel'/>
<img src="img/tattoogallery/script.jpg" alt='Script'/>
<img src="img/tattoogallery/chinese.jpg" alt='Chinese Symbols'/>
<img src="img/tattoogallery/colflower.jpg" alt='Flower'/>
<img src="img/tattoogallery/scriptfoot.jpg" alt='Foot Script Tatt'/>
<img src="img/tattoogallery/Triton.jpg" alt='Triton'/>
<img src="img/tattoogallery/zombiefingers.jpg" alt='Zombie Finger Tatt'/>
<img src="img/tattoogallery/tyler.jpg" alt='Script'/>
<img src="img/tattoogallery/3ursula.jpg" alt='Ursula'/>
<img src="img/tattoogallery/locket.jpg" alt='Locket'/>
<img src="img/tattoogallery/mechwing2.jpg" alt='Mechanical Wings'/>
<img src="img/tattoogallery/backscript.jpg" alt='Script'/>
<img src="img/tattoogallery/wingcolor.jpg" alt='Coloured Wing'/>
</div>
</div>
</div>
<div id="gallback">
<h2> Make Up </h2>
<div id="gallerywrap">
<div id='example1' class='container'>
<img src="img/tattoogallery/outlineariel.jpg" alt='Zombie Ariel.'/>
<img src="img/tattoogallery/horsecar.jpg" alt='Elaine tattooing'/>
<img src="img/tattoogallery/2small.jpg" alt='Two Small Tattoos'/>
<img src="img/tattoogallery/clown.jpg" alt='Clown'/>
<img src="img/tattoogallery/lightsabers.jpg" alt='Finger Lightsabers'/>
<img src="img/tattoogallery/flouder.jpg" alt='Flounder'/>
<img src="img/tattoogallery/grenade.jpg" alt='Grenade'/>
<img src="img/tattoogallery/colourcherryblossom.jpg" alt='Colour Cherry Blossom'/>
</div>
</div>
</div>
</div>
</body>
</html>
外部の：
$(function () {
// Unstyled Example
$.monte('#example1');
// Styled Buttons Example
// (see the CSS in the above style block)
$.monte('#example2', {auto:false});
// Callback Example
// Format and append the HTML:
$('#example3 > img').each(function(){
$(this)
.wrap('<div style="position:relative"/>')
.parent()
.append('<div><p>' + $(this).attr('alt') + '</p></div>')
.append('<img src="frame.png" alt="" class="frame"/>');
});
// Hide the text on all but the center slide:
$('#example3 div div').css({opacity: 0}).eq(0).css({opacity: 0.8});
// Using the callbacks to reveal and hide the text:
$.monte('#example3', {
auto:false,
callbackIn: function () {
$(this[0]).find('div').animate({opacity: 0.8}, 450);
},
callbackAway: function () {
$(this[0]).find('div').animate({opacity: 0}, 450);
}
});
});