2010-05-28 48 views
0

好吧,基本上,我設計和開發一個相當複雜的網站,圍繞着jQuery的使用。我對jQuery的瞭解很差,這是我第一次正確使用它。我之前在這裏發佈了一個關於腳本的問題,顯然它很糟糕,但我沒有告訴你到底是什麼,我實際上正在寫它,我現在可以。因爲我已經將它上傳到測試目錄。 它現在可以在除IE以外的其他瀏覽器中正常工作。 CSS樣式到達那裏,它應該快要結束了!但是,Internet Explorer顯示的問題很糟糕。在IE 7,8中,它看起來很好,但是當您將鼠標懸停在鏈接上時,它立即崩潰。 IE 6,顯示器似乎沒有正常工作。但IE 6是一個較小的問題。jQuery崩潰的Internet Explorer

如果你只需要5或10分鐘就可能重寫一個簡單的腳本,可能需要10個小時,我會非常感激! 繼承人網站 - http://openyourheart.org.uk/test/index.html

如果需要,我可以發送所有壓縮文件。

提前謝謝。

布拉德利

+0

繼承人的使用Javascript - http://openyourheart.org.uk/test/scripts/functions.js 繼承人的CSS - http://openyourheart.org.uk/test/style.css – 2010-05-28 11:20:30

+0

如果有人緊張點擊鏈接,我決定冒險和所有**似乎**好... – 2010-05-28 11:25:00

+1

只是一個快速提示,將re你可以結合使用選擇器,例如:'$(「。squareleft3,.squareright」)。hide();'這樣可以隱藏兩個選項,也可以指定多個類。 'class =「class1 class2」'...所以如果你想隱藏所有包含'class2'的地方,不管其他類是什麼,$(「。class2」)。hide()'。另外,你可以用逗號重新編寫這些ifs,如下所示:'if($(「.whoweare:first,.squareleft3:first,.squareright:first」)。filter(「:visible」)。length > 0).... ....要短得多:)先做這些事情,然後你的代碼將很容易解析。 – 2010-05-28 11:26:28

回答

1

在調查了更深入的撞擊事件之後,我發現只有兩個盒子實際上導致了崩潰。經驗與腳本,我發現淡入圖像造成它,如果我把它們拿走它工作得很好.. Sooo,我尋找divs之間的區別是圖像淡入,發現碰撞箱有一個ID以及一個類..這似乎影響它?!我刪除了ID,只留下了「空白方塊」類,它沒有崩潰。

原創 -

<div id="row1square2" class="blank square"> 
    <div class="square whoweare">ESTABLISHED<br/>FOR OVER<br /><span id="thirtyyears">30 YEARS</span></div> 

新版本 -

<div class="blank square"> 
    <div class="row1square2 square whoweare">ESTABLISHED<br/>FOR OVER<br /><span id="thirtyyears">30 YEARS</span></div> 

我不知道,爲什麼會產生效果,但該網站是非常接近完成,未來和偉大的感謝所有的幫助和評論,我試圖實施並繼續處理你的建議。再次 我有另外一個問題,我似乎無法化解,所以我已經張貼在這裏作爲一個新的問題..

Hide horizontal scrollbar in IE 7 and below

感謝, 布拉德利

1

你應該在你的頁面上做很多事情。

1)對於生產總是使用jQuery的縮小版本。更好的是,使用像谷歌這樣的CDN的jQuery,這樣jQuery已經被緩存在客戶端瀏覽器中的機會增加了,並且它加載的時間也減少了。

現在你jQuery是160KB,而不是在你的頭使用:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 

2)滑動面板(http://www.openyourheart.org.uk/test/scripts/jquery.slidingpanels.js)給出了404 - 檢查您是否已經在正確的位置腳本)。

3)現在有8個HTTP請求僅用於JavaScript。您可以將更多的JavaScript文件放入一個文件並進行最小化(YUI Compressor)。每個Javascript都會加載,並且會阻止其他所有內容從加載到您的頁面直到它加載並且因爲它們位於頂部。整個頁面加載需要很長時間。

在firefox中使用Firebug(Net tab)Addon等工具來查看正在加載的文件數量以及它們的大小。

4)我認爲有圖像變小的空間(單個facebook黃色圖像是500kb - 你的背景是1.3MB - 愛情傷害是590KB)你在3張圖像之間有2 MB - 想像撥號連接的人試圖訪問您的網站。
你的背景無論如何都沒有太多細節 - 在Photoshop中,如果質量下降到6-8我認爲它不會帶來太多的差異。

5)其他較小的圖像可以製作成PNG,縮小它們的尺寸會大幅縮小。對於PNG文件,您可以使用OptiPNG和其他公用程序來減小PNG圖像的大小 - 我認爲特定圖像(臉譜)應該低於25kb的範圍,一旦PNG和縮小。

6)考慮爲您的網頁GZip壓縮。

我還沒有在IE瀏覽器中看到過這個,因爲網站本身有這麼多基本上應該改變的地方。一旦你優化了你的網站,我認爲它應該可以在IE中工作,除非你的一個JavaScript有特定的IE相關問題(提示,查看已知IE相關問題的插件文檔)。

較高的加載時間對SEO不利,以及谷歌已經考慮加載時間作爲SEO參數。在firefox Firebug中,你可以安裝一個名爲YSlow的插件!這將幫助你跟蹤你可以做的其他事情。

+0

這與崩潰無關。 – Joe 2012-02-01 16:44:45

+0

-1完全沒有完成這個主題,+1的努力... -0我猜:) – frnhr 2013-08-04 11:46:28