私はいくつかのトリックが必要なのでMootoolsからJqueryに変更しました.Mootoolsは処理するには大きすぎました。
Jqueryは扱いやすく、学ぶのが簡単で、コードとロジックがより単純です。 はとにかく、ここでの問題は、コードおよびソリューションです:問題
:私は3列、SEO、テーブルなしでデザインを持っているが、その他everybrowser、上で動作しますが、3番目の列が原因に奇妙に働いていましたローディング時間+レンダリングはオンラインですが、それ以外のものでも可能です。だから、時々divが右にとどまらず、時には2番目のコンテナの下に現れました。私は、ユーザーにレンダリングされる前にサイトのすべてのイメージをロードする必要があることを発見し、それは私がFirefox(時には)で見ていた奇妙な動作を解決しました。もう一つの解決策は、サイトのhtmlのワイヤフレームを変更することでしたが、それは私が現在取り組んでいることです。プリローダーが必要なのは、サイトのレンダリングが完了したことを確認したかったからです。
サイトコード:
<<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>WH</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="es-cl" />
<link rel="stylesheet" type="text/css" href="css/template_red.css" media="screen" />
<script type="text/javascript" src="js/jquery132min.js" language="javascript"></script>
<script type="text/javascript" src="js/preloadCssImages.jQuery_v5.js" language="javascript"></script>
<script language="javascript" src="js/curvycorners.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
var $j = jQuery.noConflict();
function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs[i]=new Image; d.FP_imgs[i].src=a[i]; }
}
function FP_swapImgRestore() {//v1.0
var doc=document,i; if(doc.$imgSwaps) { for(i=0;i<doc.$imgSwaps.length;i++) {
var elm=doc.$imgSwaps[i]; if(elm) { elm.src=elm.$src; elm.$src=null; } }
doc.$imgSwaps=null; }
}
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}
function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } }
return null;
}
// JQuery stuff
$j(document).ready(function(){
$j.preloadCssImages({statusTextEl: '#textStatus', statusBarEl: '#status'});
});
$j(window).load(function() {
// $j("#container").show();
$j("#preloader").fadeOut(4000);
});
// -->
</script>
</head>
<body onload="FP_preloadImgs(/*url*/'images/redset/b_hammerhead_b.gif',/*url*/'images/redset/b_blood_b.gif',/*url*/'images/redset/b_flames_b.gif',/*url*/'images/redset/b_icesmoke_b.gif',/*url*/'images/redset/b_white_b.gif',/*url*/'images/redset/b_black_b.gif',/*url*/'images/redset/men01b.png',/*url*/'images/redset/men02b.png',/*url*/'images/redset/men03b.png',/*url*/'images/redset/men04b.png',/*url*/'images/redset/men05b.png',/*url*/'images/redset/men06b.png',/*url*/'images/redset/ban_left01_b.png',/*url*/'images/redset/ban_left02_b.png',/*url*/'images/redset/ban_left03_b.png',/*url*/'images/redset/ban_leftb01_b.png',/*url*/'images/redset/ban_leftb02_b.png',/*url*/'images/redset/ban_rite01_b.png',/*url*/'images/redset/ban_rite02_b.png',/*url*/'images/redset/ban_rite03_b.png')">
<div id="preloader" class="preloader">
<br />
<br />
<img alt="Bonehead Loading..." height="100" src="images/wh_load.jpg" width="100" /><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<img alt="..." height="21" src="images/loading.gif" width="32" /><br />
<div id="statusBar"><div id="status"><div class="status"></div></div>Loading resources...</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<img alt="Warhammer - Loading..." height="100" src="images/bonehead_load.jpg" width="100" /></div><!--Inicio container (afirma todo)-->
<div id="container" class="real">
<!--// Empieza el header--><div id="header"><div id="logo"></div><br /><div id="menuybanner"><div id="bannerz">
</div><div id="bigmenu">
<img alt="news & events" height="46" src="images/redset/men01a.png" width="68" id="img7" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img7',/*url*/'images/redset/men01b.png')" /><img alt="band history" height="46" src="images/redset/men02a.png" width="68" id="img8" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img8',/*url*/'images/redset/men02b.png')" /><img alt="metla music" height="46" src="images/redset/men03a.png" width="68" id="img9" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img9',/*url*/'images/redset/men03b.png')" /><img alt="multimedia" height="46" src="images/redset/men04a.png" width="68" id="img10" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img10',/*url*/'images/redset/men04b.png')" /><img alt="onstage" height="46" src="images/redset/men05a.png" width="68" id="img11" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img11',/*url*/'images/redset/men05b.png')" /><img alt="support us" height="46" src="images/redset/men06a.png" width="68" id="img12" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img12',/*url*/'images/redset/men06b.png')" /></div></div></div><!--//Termina el header-->
<div id="wrap1"><!-- Inicio #container2 este sostiene el container3 (barra izquierda y contenido central) y las barra derecha-->
<div id="container2">
<!-- Inicio #container3 este sostiene la columna izquierda y el body posicionado-->
<div id="container3">
<!-- Inicio #content el quie lleva el contenido-->
<div id="content">
<div id="panelcentro"><div id="pc-inside">
<img alt="WH" height="212" src="images/test2mid.gif" width="513" /></div></div>
<div class="cm-title">Contenido</div><div class="base">
<p>Aliquam elemenñum commodo augue, at ornare sapien hendrerit at. Maecenas nuñc sapien, commodo elñifend dictum vel, aliquet in magna. Nam posuere tortor in ligula tincidunt placerat. Nulña tempor pulvinar leñtus, et eleifend massa cursus ñn. In laoreet libero tempor lectus accumsan molestie. Maecenas faucibus felis nisi. Praesent volutpat liberñ a urna ullamcorper ñodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Lorem ipsum dolor sit amet, consectetur adipiscing ñlit. Curabitur mattis semper mi; ac suscipit nibh venenatis a. Quisque libero ante, malesuada in tincidunt at, suscipit nec augue. Maecenas laoreet, lacus laoreet molestie aliquañ, enim mauris fañcibus lacus, et mollis mañsa velit eu sem. Integer nec neque noñ felis dignissim semper. Proin ac magna at turpis aliquet varius vitae at diam! Etiam posuere blandit est. Quisque hendrerit, justo vel consequat rutrum, leo liberñ viverra dolor, vel ñristique libero felis in justo.</p>
<p>Class aptent taciti soñiosqu ad liñora torquenñ ñer conubia nostra, per inceptos himenaeos. Fusce risus turpis, tempus eget commodo eu, convallis at orci! Quisque neque velit, pharetña a condimentum quis, pellentesque et velit. Nunc molesñie felis nisl, porttitor pulvinar iñsum. Lorem ipsum dolñr sit amet, consectetur adipiscing elit. Aliquam erat volutpat. Sed non tellus sit amet mñuriñ scelerisque congue quis vel dolor. Vestibulum eleifend, lorem a placerat ñursus, nulla est adipiscing elit, sed blandit nibh lectus et leo. Nullam aliquam, turpis nec fermentum feñmentum; eros nisi ultricies mauris, et interdum risus diañ non arcu. Etiañ vel velit neque. Etiam vitae arcu in turpis interdum mattñs ñed vel lorem. Phasellus sed preñium libero. Aliquam ñrat volutpat. Suspendisse ñt justo pñrus. Nunc sagittis tincidñnt erañ ut laoreet. Donec cñndimentum congue placerat. Etiam et arcu neque.</p>
<p>Cras non pulvinar ligula. Aliquam elementum auctor magna in bibendum? Aenean euismod pellentesque sem et coñdimentum. Proin luctus nisl sit amet lorem imperdiet id viverra nibh mattis. Quisque id dolor ac nulla tristique aliquet a vel augue. Etiam urna quam; sollicitudin ac ullamcorper et, venenatis a tortor. Curabitur dapibus quam ullamñorper lectus interdum auctor! Nulla eget turpis ac dolor dignissim sagittis a at est? Ut in tincidunt elñt! Sed gravida, rñsus ac sagittis elementum, mañna turpis porta nisl, tincidunt susñipit massa justo id tellus. Pellentesque faucibus velit sed felis fermentñm aliquet eget quis lorem. Sed cursus libñro sed ligula euismod eu lacinia tellus suscipit. Aliquam pharetra, odio neñ suscipit molestie, dui felis pñrttitor feliñ, a eleifend metus neque in diam. Aeneñn tristique purus varius tortor mattis porta. Sñd vel diam erat, et auñtor nulla.</p>
</div>
</div>
<!--//Fin content-->
<!--//Inicio barra lateral izquierda-->
<div id="sidebarLT">
<!--<div class="bg"><div class="tl"><div class="br"><div class="trc"><div class="blc">
asdfasdasd
</div></div></div></div></div>-->
<img id="img13" alt="WH-Radio" height="65" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img13',/*url*/'images/redset/ban_left01_b.png')" src="images/redset/ban_left01_a.png" width="178" /><br />
<img id="img14" alt="WH-Market" height="65" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img14',/*url*/'images/redset/ban_left02_b.png')" src="images/redset/ban_left02_a.png" width="178" /><br />
<img id="img15" alt="WH-Contact" height="65" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img15',/*url*/'images/redset/ban_left03_b.png')" src="images/redset/ban_left03_a.png" width="178" /></div>
<div id="sidebarLM">
<div class="lm-title">Social Bookmarking</div><div class="base-lm">
<img alt="Social Bookmarks" height="38" src="images/socialtest.jpg" width="146" />
</div>
</div>
<div id="sidebarLB">
<img id="img16" alt="Battlerage" height="65" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img16',/*url*/'images/redset/ban_leftb01_b.png')" src="images/redset/ban_leftb01_a.png" width="178" /><br />
<img id="img17" alt="Raining" height="65" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img17',/*url*/'images/redset/ban_leftb02_b.png')" src="images/redset/ban_leftb02_a.png" width="178" /></div><!--//Fin barra lateral izquierda-->
</div><!--//Fin container3-->
<!--//Inicio barra lateral derecha-->
<div id="sidebarR">
<div id="sidebarRT">
<div class="rm-title">Events</div><div class="base-rm">
<p>2009 07 03<br />Próxima fecha con Raining y Timecode en el Metalkólicos Bar.</p>
<p>2009 07 03<br />Próxima fecha con Raining y Timecode en el Metalkólicos Bar.</p>
<p>2009 07 03<br />Próxima fecha con Raining y Timecode en el Metalkólicos Bar.</p></div>
</div>
<div id="sidebarRM">
<img alt="WH-Fans Sign In!" height="65" src="images/redset/ban_rite01_a.png" width="228" id="img18" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img18',/*url*/'images/redset/ban_rite01_b.png')" />
<img alt="WH-Next Shows" height="65" src="images/redset/ban_rite02_a.png" width="228" id="img19" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img19',/*url*/'images/redset/ban_rite02_b.png')" />
<img alt="WH-Last Show" height="65" src="images/redset/ban_rite03_a.png" width="228" id="img20" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img20',/*url*/'images/redset/ban_rite03_b.png')" /></div>
<div id="sidebarRB">
<div class="rm-title">Poll</div><div class="base-rm">
<p>Where would you like to see WH?<br />1- Valparaíso.<br />
2- Chillán<br />3- Temuco<br />4- Valdivia<br />5- La Serena<br />6- Iquique</p>
</div>
</div>
</div>
<!--//Fin barra lateral derecha-->
</div><!--//FIN container2--></div>
<!-- Topslide --><div id="topslide"><div id="headtop">contenidos</div><div id="top_navlist">inicio contacto mapa del sitio enlaces buscar</div><div id="themeselector"><div id="blood">
<img alt="Themes" height="13" src="images/redset/tit_themes.gif" width="44" /><img alt="bloodcrushed" height="13" src="images/redset/b_blood_a.gif" width="72" id="img2" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img2',/*url*/'images/redset/b_blood_b.gif')" /><img alt="firesmoke" height="13" src="images/redset/b_flames_a.gif" width="72" id="img3" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img3',/*url*/'images/redset/b_flames_b.gif')" /><img id="img4" alt="icysmoke" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img4',/*url*/'images/redset/b_icesmoke_b.gif')" src="images/redset/b_icesmoke_a.gif" width="72" /><img id="img5" alt="whitenblack" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img5',/*url*/'images/redset/b_white_b.gif')" src="images/redset/b_white_a.gif" width="72" /><img id="img6" alt="blacknwhite" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img6',/*url*/'images/redset/b_black_b.gif')" src="images/redset/b_black_a.gif" width="72" /></div><div id="flames"><img alt="Themes" height="13" src="images/redset/tit_themes.gif" width="44" /><img alt="bloodcrushed" height="13" src="images/redset/b_blood_a.gif" width="72" id="img2v" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img2v',/*url*/'images/redset/b_blood_b.gif')" /><img alt="firesmoke" height="13" src="images/redset/b_flames_a.gif" width="72" id="img3v" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img3v',/*url*/'images/redset/b_flames_b.gif')" /><img id="img4v" alt="icysmoke" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img4v',/*url*/'images/redset/b_icesmoke_b.gif')" src="images/redset/b_icesmoke_a.gif" width="72" /><img id="img5v" alt="whitenblack" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img5v',/*url*/'images/redset/b_white_b.gif')" src="images/redset/b_white_a.gif" width="72" /><img id="img6v" alt="blacknwhite" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img6v',/*url*/'images/redset/b_black_b.gif')" src="images/redset/b_black_a.gif" width="72" /></div><div id="icesmoke"><img alt="Themes" height="13" src="images/redset/tit_themes.gif" width="44" /><img alt="bloodcrushed" height="13" src="images/redset/b_blood_a.gif" width="72" id="img2w" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img2w',/*url*/'images/redset/b_blood_b.gif')" /><img alt="firesmoke" height="13" src="images/redset/b_flames_a.gif" width="72" id="img3w" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img3w',/*url*/'images/redset/b_flames_b.gif')" /><img id="img4w" alt="icysmoke" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img4w',/*url*/'images/redset/b_icesmoke_b.gif')" src="images/redset/b_icesmoke_a.gif" width="72" /><img id="img5w" alt="whitenblack" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img5w',/*url*/'images/redset/b_white_b.gif')" src="images/redset/b_white_a.gif" width="72" /><img id="img6w" alt="blacknwhite" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img6w',/*url*/'images/redset/b_black_b.gif')" src="images/redset/b_black_a.gif" width="72" /></div><div id="white"><img alt="Themes" height="13" src="images/redset/tit_themes.gif" width="44" /><img alt="bloodcrushed" height="13" src="images/redset/b_blood_a.gif" width="72" id="img2x" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img2x',/*url*/'images/redset/b_blood_b.gif')" /><img alt="firesmoke" height="13" src="images/redset/b_flames_a.gif" width="72" id="img3x" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img3x',/*url*/'images/redset/b_flames_b.gif')" /><img id="img4x" alt="icysmoke" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img4x',/*url*/'images/redset/b_icesmoke_b.gif')" src="images/redset/b_icesmoke_a.gif" width="72" /><img id="img5x" alt="whitenblack" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img5x',/*url*/'images/redset/b_white_b.gif')" src="images/redset/b_white_a.gif" width="72" /><img id="img6x" alt="blacknwhite" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img6x',/*url*/'images/redset/b_black_b.gif')" src="images/redset/b_black_a.gif" width="72" /></div><div id="black"><img alt="Themes" height="13" src="images/redset/tit_themes.gif" width="44" /><img alt="bloodcrushed" height="13" src="images/redset/b_blood_a.gif" width="72" id="img2y" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img2y',/*url*/'images/redset/b_blood_b.gif')" /><img alt="firesmoke" height="13" src="images/redset/b_flames_a.gif" width="72" id="img3y" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img3y',/*url*/'images/redset/b_flames_b.gif')" /><img id="img4y" alt="icysmoke" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img4y',/*url*/'images/redset/b_icesmoke_b.gif')" src="images/redset/b_icesmoke_a.gif" width="72" /><img id="img5y" alt="whitenblack" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img5y',/*url*/'images/redset/b_white_b.gif')" src="images/redset/b_white_a.gif" width="72" /><img id="img6y" alt="blacknwhite" height="13" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img6y',/*url*/'images/redset/b_black_b.gif')" src="images/redset/b_black_a.gif" width="72" /></div></div><div id="hammerhead">
<img alt="Hammerheads" height="10" src="images/redset/b_hammerhead_a.gif" width="88" id="img1" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(1,1,/*id*/'img1',/*url*/'images/redset/b_hammerhead_b.gif')" /></div><!-- End Topslide --></div><!-- Inicio #breadcrumbs-->
<div id="migas">inicio - jdhasodhs - Breadcrumbs</div><!-- fin #breadcrumbs--><!--//incio prefooter-->
<div id="prefooter">
<div id="pf1"><div class="pf-t">About Warhammer</div><div class="pf-b">-
Faq<br />- Website Support<br />- Media Support<br />- Free
Music Downloads<br />
- Suscribe</div></div><div id="pf2"><div class="pf-t">Find Warhammer</div><div class="pf-b">-
Myspace<br />
- Facebook<br />
- Lastfm<br />
- Youtube<br />
- Forums</div></div><div id="pf3"><div class="pf-t">More Warhammer</div><div class="pf-b">
- Contact<br />
- Media<br />
- Advertisement<br />
- Contests & Promotions<br />
- Bonehead</div></div><div id="pf4"><div class="pf4-t"></div><div class="pf4-b">
<img alt="Bonehead" height="97" src="images/bh-logo.jpg" width="54" class="aleft" /><br />
</div></div></div><!--//FIN prefooter--><!--//incio footer-->
<div id="footer">
privacy contents / Warhammer & WH / CC2009 - Santiago, Chile</div><!--//FIN footer-->
</div><!--//Fin container-->
</body></html>
解決法1:私はそれがイメージのロードを終えていただろうまでちょうど、「本物」のサイトをレンダリングしないようにブラウザをだますことにしました。 を使用するstyle = "display:none"私はブラウザが親divをレンダリングしないようにしています。読み込み時間が完了すると、divが表示され、完全にロードされると、okが表示されます。このプロセスをカバーするために何か必要なので、ユーザーはシステムが動作していることを2秒間待っているので、ロード・プロセスについてblablaでサイト全体をカバーするdivを作った。
MooToolsは:
window.addEvent('load', function() {
$('container').setStyle('display', 'show');
$('preloader').get('tween').start('opacity', 0).chain(function(){
$('preloader').setStyle('display', 'none');
});
}).fade(0);
}
(注)この溶液中で、私はまだ移行にかかる時間を制御することはできませんことを。 私がこれをした間違った答えは別の答えですが、私はこの新しい状況にどう対応するのか分かりません。いずれにしても、これは単なるトリックであると判断し、実際に画像をプレロードしてサイトを一度に表示できるものが必要でした。
対処方法2: 私は前と同じ考えを使用しますが、私は、私は、ディスプレイに必要なかったことを実現:TIは、プリローダーのdivでベールに包まれたならばどれもコンテナのdiv。一方、IEはdisplay:noneを使用し、内側のdivがコーナーを丸めするスクリプトを使用していたため、IEがクレイジーになってしまったため、IEにエラーが発生しました。 Jqueryを使用していて、すべて正常に動作することを修正しました。
のjQuery:
var $j = jQuery.noConflict();
$j(document).ready(function(){
$j.preloadCssImages({statusTextEl: '#textStatus', statusBarEl: '#status'});
});
$j(window).load(function() {
$j("#preloader").fadeOut(4000);
});
最初の命令は、MooToolsの持つ問題を回避するためでした。
2行目は、ドキュメントの準備ができているようにイメージのプリロードを有効にするための行です。これは、satusBarElで示されるidを持つdivにステータスバーを適用します。これを行うためのツールは、here @filamentgroup
からダウンロードできます。最終的な部分は、ドキュメント+画像全体が準備完了するとすぐに4秒のフェードアウトを行います。これは#preloader divに適用されます。
これだけです。 テストしたすべてのブラウザで正常に動作します。
おそらく、私たちがテストできるように、何がうまくいかないかを示すhtml + cssスニペットを使ってこの例を明確にすることはできますか? –