JQuery UI FirefoxとIEのボタンとしてスタイリングしていないタグ

JQuery UIボタンとしてリンクのスタイルを設定しようとすると、奇妙な問題が発生します。 Chromeのボタンとして表示され、FirefoxやIE8のリンクとして表示されます。JQuery UI FirefoxとIEのボタンとしてスタイリングしていないタグ

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
     "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <script type="text/javascript" src="script/jquery-1.4.2.js"></script> 
    <script type="text/javascript" src="script/jquery-ui-1.8.9.custom.min.js"></script> 
    <link rel="stylesheet" type="test/css" href="stylesheet/jquery-ui-1.8.9.custom.css"> 
    <link rel="stylesheet" type="text/css" href="stylesheet/styles.css"> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $("a").button(); 
     }); 
    </script> 
    <title>Introduction</title> 
</head> 
<body class="indexbody"> 
    <div class="indexwrapper"> 
     <div id="introduction">   
      <div class="btn"> 
       <a href="test.html" >link</a> 
      </div> 
     </div> 
    </div> 
</body> 
</html>

出典

2011-01-31 Andrew Douglas

Firebugの結果は何ですか？あなたはUI値がクラス属性に設定されるのを見ますか？これまでに何を試しましたか？トム・クルーズの有名な言葉では、「助けてください」と言います。 – jmort253

Firefox：class = "ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" Chrome：class = "ui-button ui-widget ui-state-default ui-corner -all ui-button-text-only " 生成されたHTMLはFirefoxとChromeで同じです。 IEでは、ui- *クラスは適用されません。 –

Chromeでは（期待どおり）緑のボタンが表示されます。 FirefoxとIEではリンクがあります。 –

あなたのCSSのリンク要素にタイプミスを見逃しやすいがあるように見えます。 type属性はtext/cssで、test/cssではありません。

xとsは互いに非常に近いです。

<link rel="stylesheet" type="text/css" 
    href="stylesheet/jquery-ui-1.8.9.custom.css">

クロムは適応していますが、他のブラウザは構文がより厳密です。 ChromeはRobustness Principleに従います。

最後に、CSSまたはJavaScriptを読み込む順序は問題にはなりません。リンクタグは、スクリプト要素の前後に置くことができます。

出典

2011-01-31 04:14:18 jmort253

はい、それでした。ありがとうございました！ –

@Andrew - ようこそ。それはあまりにも悪いですが、Firebugはそれのようなものを見つけて報告しません。私のHTML Validator for Firefoxの拡張は、いずれにも不平を言っていませんでした。 – jmort253

私は、このHTML Validatorをやってもらえるかもしれません。私は実際に私のタイプミスを眺める必要があります:)クロムはこのタイプで働いていて、他は失敗したことに感心しました。私は通常、Firefox、IE、そして最後にChromeでテストしますが、今はこの注文に固執すると思います。 –

CSSが最初にJSの組み込みになり、問題が解決するはずです。

<link rel="stylesheet" type="test/css" href="stylesheet/jquery-ui-1.8.9.custom.css"> 
<link rel="stylesheet" type="text/css" href="stylesheet/styles.css"> 
<script type="text/javascript" src="script/jquery-1.4.2.js"></script> 
<script type="text/javascript" src="script/jquery-ui-1.8.9.custom.min.js"></script>

出典

2011-01-31 03:47:21 yoda

にあります。チップのおかげで、それに応じて注文が変更されました。 –

JQuery UI FirefoxとIEのボタンとしてスタイリングしていないタグ

答えて

関連する問題