jQuery の知識を広げるために、個人の Web サイトに取り組んでいます。このページは PHP で作成しましたが、コンソール エラーなしで正常に動作します: http://sallibert.com/apps/notes/notes.php
しかし、インデックス ファイルにインクルードを使用して呼び出すと、アニメーションがロード中にスタックします: http://sallibert.com/index.php#!notes
JS リンクは良好で、悪いリンクはありません。
これらのさまざまなソリューションを試しましたが、どれも機能しません。
- JS リンクを本文に配置する
$('document').ready(function(){と 置き換えますjQuery(document).ready(function(){- jQuery.noConflict();
このバグを修正するアイデアはありますか? 助けてくれてありがとう！
編集 ：
上記のリンクを更新しました。今すぐ確認できます。Firefox ではエラー ログはありませんが、Chrome では 2 つ取得しました。私はそれらを解決しようとします：
Uncaught TypeError: Cannot call method 'toLowerCase' of undefined 最初のバグはこれに関連していると思います。
と
Uncaught TypeError: Cannot read property 'style' of null 最初に、html を使用して html をロードし、ページがロードされたら、いくつかの JS を適用します。
$(document).ready(function(){
...
$('#horloge .app_logo').append('<img class="aigfix" id="aigS" src="img/aigS.png" alt="" style="transform: rotate(314784deg);"><img class="aig" id="aigM" src="img/aigM.png" alt="" style="transform: rotate(5246deg);"><img class="aighfix" id="aigH" src="img/aigH.png" alt="" style="transform: rotate(437deg);">');
....
});
window.onload = function() // wait before load
{
var d = new Date();
var time = d.getSeconds() + 60 * d.getMinutes() + 3600 * d.getHours();
var aigS = document.getElementById('aigS');
var aigM = document.getElementById('aigM');
var aigH = document.getElementById('aigH');
aigS.style.MozTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.WebkitTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.OTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.msTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.transform = 'rotate(' + (time * 6) + 'deg)';
aigM.style.MozTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.WebkitTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.OTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.msTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.transform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigH.style.MozTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.WebkitTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.OTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.msTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.transform = 'rotate(' + Math.round(time / 120) + 'deg)';
setInterval(function() {
time++;
aigS.style.MozTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.WebkitTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.OTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.msTransform = 'rotate(' + (time * 6) + 'deg)';
aigS.style.transform = 'rotate(' + (time * 6) + 'deg)';
aigM.style.MozTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.WebkitTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.OTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.msTransform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigM.style.transform = 'rotate(' + Math.round(time / 10) + 'deg)';
aigH.style.MozTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.WebkitTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.OTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.msTransform = 'rotate(' + Math.round(time / 120) + 'deg)';
aigH.style.transform = 'rotate(' + Math.round(time / 120) + 'deg)';
}, 1000);
}
PHPインクルードコードは次のとおりです。
<?php
$appid = strtolower($_GET['appid']);
if($appid && file_exists('apps/'.$appid.'/'.$appid.'.php')){
header('Location: apps/'.$appid.'/'.$appid.'.html');
}
?>
Update2: フォルダー内のアプリが未定義であることを確認しました。配列を使用して呼び出します: $apps[1] = Array( 'Maps', Array('CV',Array('Complet','Experiences','Compétences','Diplomes','Autres','Rech erche')), 'メッセージ', ... ); Uncaught TypeError: Cannot call method 'toLowerCase' of undefined. を解決しました。しかし、メモアプリのバグ負荷という主な問題は解決しませんでした。
助けてくれてありがとう！