これは基本的にw3Schoolで動作しますが、私の実際の環境では動作しません。ここでは、コードは次のようになります。ここでは.fade私のコードでは動作しませんが、w3Schoolで同じコードでうまく動作します。どうして?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>Vecta Corp. Mobile</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script>
$(document).ready(function(){
$("#5").click(function(){
$("#yourview").fadeTo(1000, 0.05);
});
});
</script>
</head>
<body>
<section data-role="content">
<h2>Dr. Tint SolarPill Tint</h2>
<h3>See how SolarPill looks from inside your tinted car</h3>
<p><img alt="" src="images/tintshade.png" id="yourview" style="width:347px;"></p>
<p style="width:350px;">
<input id="5" value="5%" style="font-size:12px;width: 36px;margin-left: 18px;" type="button">
</p>
</section>
</div>
</body>
</html>
は次のとおりです。w3school linkし、その中にこのコードを貼り付けて、自分で試してみてください。それは文字通りの唯一の違いであるよう
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#5").click(function(){
$("#yourview").fadeTo(1000, 0.4);
});
});
</script>
</head>
<body>
<p><img alt="" src="http://www.mobile-tinting.com/img.png" id="yourview" style="width:347px;"></p>
<input id="5" value="5%" style="font-size:12px;width: 36px;margin-left: 18px;" type="button">
</body>
</html>
はjqueryの携帯と競合このです2つのコード。あるいは私はここで何か間違っているのですか?
デベロッパーコンソールには何が通知されますか? btw、より良いチュートリアルのWebサイトを試してください。 – Raptor
私のためにうまくいきます..ブラウザの 'console'を確認してください。 –
私のコンソールを確認しても問題はありません。あなたのコードはうまく動作しますか? –