IEは私には謎です。私のWebアプリはSafari、Firefox、Chrome、さらにはiPhoneやiPadでも動作しますが、IEに関しては、特定の標準に準拠することがどれほど難しいかを理解できません。とにかく十分に怒鳴る。
私のTwitterブートストラップボタンはIE8では完全に無視されます。ボタンをクリックしても何も起こりません。私はグーグルで何も見つけることができませんでした、誰かがこれに出くわしましたか?
どうもありがとう、
IEは私には謎です。私のWebアプリはSafari、Firefox、Chrome、さらにはiPhoneやiPadでも動作しますが、IEに関しては、特定の標準に準拠することがどれほど難しいかを理解できません。とにかく十分に怒鳴る。
私のTwitterブートストラップボタンはIE8では完全に無視されます。ボタンをクリックしても何も起こりません。私はグーグルで何も見つけることができませんでした、誰かがこれに出くわしましたか?
どうもありがとう、
@Kaveあなたはプレーンなhtmlだけをjsfiddleにアップロードしました-これには存在しないjsへのリンクが含まれています(したがって、jsが接続されていない場合はデバッグが困難です)。
多くのボタンの代わりにhrefを使用してみてください。twitterbootsrapは、ボタンのように見えるリンクのスタイル設定をサポートしています。例は、次のようなTwitterブートストラップの最初のページにあります。
<a class="btn btn-success btn-large" href="http://twitter.github.com/bootstrap/base-css.html">Example link with button styles</a>
編集:または、Twitterブートストラップを使用した完全な例(デモテンプレートから変更-ヒーローユニット内のボタンスタイルとリンク) -コピーしてファイルに貼り付け、testing.htmlとして保存し、ブラウザで開きます-お楽しみください!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bootstrap, from Twitter</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Le styles -->
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet">
<style type="text/css">
body {
padding-top: 60px;
padding-bottom: 40px;
}
</style>
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet">
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="http://getbootstrap.com/2.3.2/assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="http://getbootstrap.com/2.3.2/assets/ico/apple-touch-icon-57-precomposed.png">
</head>
<body>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
<p><a class="btn btn-success btn-large" onclick="alert('its working :)')">Learn more »</a></p>
</div>
</div>
</div>
<hr>
<footer>
<p>© Company 2012</p>
</footer>
</div><!--/.fluid-container-->
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="http://getbootstrap.com/2.3.2/assets/js/jquery.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-transition.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-alert.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-modal.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-dropdown.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-scrollspy.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-tab.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-tooltip.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-popover.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-button.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-collapse.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-carousel.js"></script>
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap-typeahead.js"></script>
</body>
</html>
それでも機能しない場合は、IEを再起動するときに、確認するためのポップアップが表示されたら、[ブロックされたコンテンツを許可する]をクリックしてください。
ブロックされたコンテンツを許可すると、javascript コンテンツが参照されます。ボタンは純粋に CSS コードです。問題は、IE 6....8 が CSS3 を十分にサポートしていないことです。getbootstrao.com Web サイトを見ると、それらが独自のボタンを使用していることはわかりません :)) 最良の解決策は、シンプルな CSS を使用してボタンを作成することです。実際の正方形だが機能するボタンを見つけます。