2011-11-09 13 views
1

jQueryメニュータブをマイページに追加しました。ここに表示されているように、CSSには矛盾があります。http://newbie-cms.com/demo1jQueryタブCSSがjQueryメニューと矛盾しています。

ここでは、jQueryタブのみを使用してページを区切りました。http://newbie-cms.com/demo1/channeltabsとうまくいきます。また、http://newbie-cms.com/demo1/index.htmlページはタブなしで正常に動作します。

しかし、タブコードを動画ページと組み合わせると、ul,li個のタブの項目がずれることになります。

私のCSSでは、これは修正できますか?

答えて

0

クラスの割り当てを確認してください。

たとえば、あなたの機能メニューに基づいて、ul要素は、クラスui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-allを持つべきとのli要素は、クラスui-state-default ui-corner-topを持っている必要があり

0

次のようにあなたの頭は次のとおりです。ここで

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<link href="jquery-ui.css" rel="stylesheet" type="text/css"/> 
<link rel="stylesheet" href="menu.css" type="text/css" media="screen" /> 

<title>Mega Drop Down Menu</title> 
<!--[if IE 6]> 
<style> 
body {behavior: url("csshover3.htc");} 
#menu li .drop {background:url("img/drop.gif") no-repeat right 8px; 
</style> 
<![endif]--> 

    <script type="text/javascript" 
     src="http://www.google.com/jsapi"></script> 



    <script> 
    $(function() { 
     $("#tabs").tabs({ 
      event: "mouseover" 
     }); 
    }); 
    </script> 

<link href="jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script src="jquery.min.js"></script> 
    <script src="1.8/jquery-ui.min.js"></script> 

    <script> 
    $(document).ready(function() { 
    $("#tabs").tabs(); 
    }); 
    </script> 

</head> 

あなたがしていることがわかり$( "#tabs")。tabs()を2回呼び出して、このコードブロックのためにJavaScriptエラーが発生しました。

<script> 
$(function() { 
    $("#tabs").tabs({ 
     event: "mouseover" 
    }); 
}); 
</script> 

が実行されました。 E jQueryが読み込まれます。 これを最初に修正する必要があります...

+0

ありがとうGerjanOnline。私はJqueryがロードされる前に私がこれを呼び出すのを見て、 の呼び出しスクリプトの上にjquery外部呼び出しリンクタグを移動しました:。私はまた、2つのCSSファイルを参照してください:menu.cssとjquery-ui.cssファイルは、クラスで言及されたkurtthevikingです。 – user1033514

+0

。私はまた、2つのCSSファイルを参照してください:menu.cssとjquery-ui.cssファイルは、クラスで言及されたkurtthevikingです。あなたの忍耐力に必要なクラスを編集して追加する方法がわかりません。 – user1033514

関連する問題