マウスオーバーで動くメガドロップダウンメニューが、ページを開くだけで動いてしまいます。

初めて質問させていただきます。よろしくお願いします。
jQueryやjsなどのプログラムは全くの初心者で、いつもwebサイトを参考にさせていただき、作成しています。

http://sankoblog.hatenablog.com/entry/2016/06/08/230800
こちらのサイトを参考にさせていただき、ナビボタンのトロップダウンメニューを作りました。

<nav>   
<div id="navwrapper">
<div id="mddNav">
<ul>
<li>
<a href="index.html"><img src="../img/cal_logo.png" width="127" height="39" alt=""/></a></li>
<li><a href="#">サービス<br /><span class="s">Service</span></a>
<div class="mddWrap">
<div class="mddInner">
<div class="dropContent">
<div>
<span><a href="promotion.html">
          <img src="../img/gnav1_promotion.png" width="150" height="50" alt=""/><br />
          <span class="title">promotion</span><br />
          <span class="ruby">プロモーション</span>
          </a></span>
</div>
<div>
<span><a href="performance.html">
          <img src="../img/gnav1_peformance.png" width="150" height="50" alt=""/><br />
          <span class="title">performance</span><br />
          <span class="ruby">パフォーマンス</span>
          </a></span>
</div>
<div>
<span><a href="operation.html">
          <img src="../img/gnav1_operation.png" width="150" height="50" alt=""/><br />
          <span class="title">operation</span><br />
          <span class="ruby">オペレーション</span>
          </a></span>
</div>
<div>
<span><a href="platform.html">
          <img src="../img/gnav1_platform.png" width="150" height="50" alt=""/><br />
          <span class="title">platform</span><br />
          <span class="ruby">プラットフォーム</span>
          </a></span>
</div>
<div>
<span><a href="toollineup.html">
          <img src="../img/gnav1_tool.png" width="150" height="50" alt=""/><br />
          <span class="title">toollineup</span><br />
          <span class="ruby">ツールラインナップ</span>
          </a></span>
</div>
<div>
<span><a href="enviromentalpolicy.html">
          <img src="../img/gnav1_env.png" width="150" height="50" alt=""/><br />
          <span class="title">enviromental policy</span><br />
          <span class="ruby">環境活動方針</span>
          </a></span>
</div>
</div><!--.dropContent-->
</div><!-- /.mddInner -->
</div><!-- /.mddWrap -->
</li>
<li><a href="#">コンテンツ<br /><span class="s">Contents</span></a>
<div class="mddWrap">
<div class="mddInner">
<div class="dropContent">
<div>
<span><a href="pintocalneco.html">
          <img src="../img/gnav2_pin.png" width="150" height="50" alt=""/><br />
          <span class="title">「ピン!」とカルネコ</span>
          </a></span>
</div>
<div>
<span><a href="promogoroku.html">
          <img src="../img/gnav2_goroku.png" width="150" height="50" alt=""/><br />
          <span class="title">販促プロモ語録</span>
          </a></span>
</div>
<div>
<span><a href="customervoice.html">
          <img src="../img/gnav2_voice.png" width="150" height="50" alt=""/><br />
          <span class="title">導入企業様の声</span>
          </a></span>
</div>
<div>
<span><a href="customervoice.html">
          
          <span class="title2"></span>
          </a></span>
</div>
<div>
<span><a href="customervoice.html">
          
          <span class="title2"></span>
          </a></span>
</div>
</div><!--.dropContent-->
</div><!-- /.mddInner -->
</div><!-- /.mddWrap -->
</li>
<li><a href="about/philosophy.html">事業内容<br />
<span class="s">Corporate Profile</span>
</a></li>
<li><a href="newstopics.html">ニュース<br />
<span class="s">News/Topics</span>
</a></li>
<li><a href="contactus.html">お問い合せ<br />
<span class="s">Contuct Us</span>
</a></li>
</ul>
</nav><!-- /#mddNav -->
<div id="content">
</div><!-- /#content -->
</div><!-- /#navwrapper -->	

 <script>
$(window).load(function () {
  $('#mddNav > ul > li').hover(function(){
    childPanel = $(this).children('.mddWrap');
    childPanel.each(function(){
		
  childPanel.css({height:'0',display:'block',opacity:'0'}).stop().animate({height:'130px',opacity:'1'},500,'swing');
    });
  },function(){
    childPanel.css({display:'none'});
  });
});
</script>
<script>
$(window).load(function () {
	var $win = $(window),
	    $main = $('main'),
	    $nav = $('nav'),
	    navHeight = $nav.outerHeight(),
	    navPos = $nav.offset().top,
	    fixedClass = 'is-fixed';

	$win.on('load scroll', function() {
		var value = $(this).scrollTop();
		if ( value > navPos ) {
			$nav.addClass(fixedClass);
			$main.css('margin-top', navHeight);
		} else {
			$nav.removeClass(fixedClass);
			$main.css('margin-top', '0');
		}
	});
});
</script>