WOW.js 殊效講授

展示網址:點我旁觀



 

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()



範例圖片

用jquery做相册

網頁設計用jquery做相册






CSS



  1. body{ text-align:center;}

  2. *{ margin:0; padding:0;}

  3. img{ border:none;}

  4. #container{ width:900px; height:900px; background:#000000; border:1px solid #006633; margin:auto; padding:0;}

  5. #loader{ width:480px; margin:auto; height:500px; background:#FFFFFF; float:left; margin-right:5px;}

  6. #imageOptions{ float:left;}

  7. #imageOptions li{ list-style:none; margin:10px;}

  8. .loading{ background:url(images/spinner.gif) center center no-repeat;}

  9. h3{ line-height:500px;}



複製代碼

HTML code



  1. <div id="container">

  2.         <div id="loader">

  3.         <h3>Click on an image to view it full size.</h3>

  4.         </div>

  5.         <ul id ="imageOptions">

  6.                 <li><a href="#"><img width="200px" src="./uploads/20131251.jpg" alt="image" /></a></li>

  7.                 <li><a href="#"><img width="200px" src="./uploads/20131252.jpg" alt="image" /></a></li>

  8.                 <li><a href="#"><img width="200px" src="./uploads/20151213.jpg" alt="image" /></a></li>

  9.                 <li><a href="#"><img width="200px" src="./uploads/20160415netyea_banner1.jpg" alt="image" /></a></li>

  10.                 <li><a href="#"><img width="200px" src="./uploads/20160414netyea_banner5.jpg" alt="image" /></a></li>

  11.         </ul>

  12. </div>



複製代碼
網頁設計


JavaScript code



  1. $(function(){

  2.         $("#imageOptions a").click(function(){

  3.                 var imageSource = $(this).children("img").attr("src");

  4.                 $('#loader').addClass("loading");

  5.                 $("h3").remove();

  6.                 showImage(imageSource);

  7.                 return false;

  8.         });

  9. });

  10. function showImage(src)

  11. {

  12. $("#loader img").fadeOut("slow").remove();

  13. var largeImage = new Image();

  14. $(largeImage).attr("src",src)

  15.         .load(function(){

  16.                 $(largeImage).hide();

  17.                 $("#loader").removeClass("loading").append(largeImage);

  18.                 $(largeImage).fadeIn("slow");

  19.         });

  20. }



複製代碼
網頁設計


reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

若何封閉 GDM 及 nouveau 並安裝 NVIDIA
安裝顯示卡 NVIDIA驅動時

泛起毛病 

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

網頁設計 BootStrap img-responsive
許多人用BootStrap 圖片因寬度縮小看起來很高興



可是縮得太小的時刻,高度會到達最小高度是以無法往下縮



會造成圖片變形,如圖

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

php5與php7的區分是什麼 網頁設計

php5與php7的區分是什麼?下面本篇文章就來給大師對照一下php5與php7,介紹php5與php7之間的區分。有必然的參考價值,有需要的朋侪可以參考一下,希望對你有所輔助。

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

OpenCart 4.X 新增分類泛起毛病
OpenCart 4.X 新增分類呈現毛病 (靜態網址下)

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

Yolov8 PyTorch出現 An attempt ha
近從新調試一段pytorch 程式碼,以前的伺服器上完全沒問題,但換了一台機器,重新安裝了新版本的cuda, anaconda ,pytorch 等,以前的程式碼呈現各類版本不適合的問題。

問題:

如今說說這個問題。運行pytorch 時泛起的環境如下:

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

PHP弊端Notice  Use of undefined
本文為人人講授的是PHP毛病Notice : Use of undefined constant 的完美解決方式,這個php的非致命毛病提示在pph5.3以上的版本中出現的頻率非常好,首要是因為php.ini中的錯誤級別設置裝備擺設的問題,感興趣的同學參考下.



本文為人人講授的是PHP錯誤Notice : Use of undefined constant 的完善解決方法,這個php的非致命毛病提示在php5.3以上的版本中泛起的頻率很是好,主要是因為php.ini中的毛病級別設置裝備擺設的問題.



問題申明:會快速造成磁碟空間滿載,導致系統無法正常利用.

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

JAVA 若何在LINUX COPY files時呈現PRO
有利用過進度條的朋友一定會感覺很不利便

因為要從0~100讀取 鋪張時候

因檔案大小也不知道這時候間讀寫的完嗎?

如這篇

Java Swing 如何利用進度



於是顛末批改

改成此方式網頁設計

可使用DIALOG準確的抓到讀寫完成的時間

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

bootstrap 在小銀幕下若何把導覽列下移不致蓋住LOG
再用bootstrap時,經常會遇到一些小細節須要點竄



經常為了一些小問題找半天網頁設計



GOOGLE半天也沒看到有人申明此問題



所以就只好自己來了



找到bootstrap.css



到場

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

網頁設計

web gzip 測試網站



1、什麼是gzip         

        gzip是一種數據花樣,默許且今朝僅利用deflate算法緊縮data部門;


        Gzip是一種風行的文件壓縮算法,現在的利用十分普遍,特別是在Linux平台。當運用Gzip緊縮到一個純文本文件時,結果長短常顯著的,大約可以減少70%以上的文件大小。這取決於文件​​中的內容。


      行使Apache中的Gzip模塊,我們可以使用Gzip壓縮算法來對Apache服務器發布的網頁內容進行緊縮後再傳輸到客戶端瀏覽器。這樣顛末壓縮後實際上下降了收集傳輸的字節數,最顯明的益處就是可以加速網頁加載的速度。


      網頁加載速度加速的益處不問可知,除節約流量,改良用戶的瀏覽體驗外,另外一個潛在的益處是Gzip與搜刮引擎的抓取工具有著更好的關係。例如Google就能夠通過直接讀取gzip文件來比通俗手工抓取更快地檢索網頁。在Google網站管理員東西(Google Webmaster Tools)中你可以看到,sitemap.xml.gz 是直接作為Sitemap被提交的。


      而這些優點其實不僅僅限於靜態內容,PHP動態頁面和其他動態生成的內容都可以經由過程使用Apache緊縮模塊緊縮,加上其他的機能調整機制和響應的辦事器端緩存法則,這可以大大提高網站的機能。是以,對於擺設在Linux辦事器上的PHP程序,在辦事器支持的環境下,我們建議你開啟使用Gzip Web壓縮。


 

PS:詳情參考:http://baike.baidu.com/item/gzip?fr=aladdin



2、什麼是deflate

        DEFLATE是同時利用了LZ77算法與哈夫曼編碼(Huffman Coding)的一個無損數據緊縮算法。


        它最初是由Phil Katz為他的PKZIP歸檔對象第二版所定義的,後來定義在RFC 1951規範中。


        人們普遍認為DEFLATE不受任何專利所製約,而且在LZW(GIF文件花樣利用)相幹的專利失效之前,這類花樣除了在ZIP文件格局中獲得利用以外也在gzip緊縮文件和PNG圖像文件中獲得了運用。


        DEFLATE緊縮與解壓的源代碼可以在自由、通用的壓縮庫zlib上找到。


        更高緊縮率的DEFLATE是7-zip所實現的。AdvanceCOMP也利用這種實現,它可以對gzip、PNG、MNG和ZIP文件進行緊縮從而得到比zlib更小的文件巨細。在Ken Silverman的KZIP與PNGOUT中利用了一種加倍高效同時要求更多用戶輸入的DEFLATE法式。


        deflate是一種緊縮算法,是huffman編碼的一種加強。


        deflate與gzip解壓的代碼幾近溝通,可以合成一塊代碼。



3、web辦事器處置http緊縮的進程

    1. Web辦事器領受到瀏覽器的HTTP要求後,查抄瀏覽器是否支撐HTTP壓縮(Accept-Encoding 信息);


    2. 如果瀏覽器撐持HTTP緊縮,Web辦事器查抄請求文件的後綴名;


    3. 若是請求文件是HTML、CSS等靜態文件,Web辦事器到壓縮緩衝目次中查抄是否已存在請求文件的最新緊縮文件;


    4. 若是要求文件的緊縮文件不存在,Web辦事器向瀏覽器返回未緊縮的要求文件,並在壓縮緩衝目錄中存放請求文件的壓縮文件;


    5. 假如要求文件的最新壓縮文件已經存在,則直接返回要求文件的緊縮文件;


    6. 假如要求文件是動態文件,Web辦事器動態緊縮內容並返回瀏覽器,緊縮內容不寄存到緊縮緩存目次中。


下面是兩個演示圖:


未使用Gzip:


Linux 虛擬主機上處置懲罰HTTP壓縮之gzip、def
Linux 虛擬主機上處置懲罰HTTP壓縮之gzip、def

 

開啟利用Gzip後:


 


Linux 虛擬主機上處置懲罰HTTP壓縮之gzip、def


Linux 虛擬主機上處置懲罰HTTP壓縮之gzip、def

 

四、gzip與deflate區別

        deflate利用inflateInit(),而gzip使用inflateInit2()進行初始化,比inflateInit()多一個參數: -MAX_WBITS,暗示處置懲罰raw deflate數據。因為gzip數據中的zlib壓縮數據塊沒有zlib header的兩個字節。使用inflateInit2時要求zlib庫忽略zlib header。在zlib手冊中要求windowBits為8..15,但是現實上其它局限的數據有非凡作用,見zlib.h中的註釋,如負數示意raw deflate。        


        Apache的deflate變種可能也沒有zlib header,需要添加假頭後處置懲罰。即MS的毛病deflate (raw deflate).zlib頭第1字節一般是0x78, 第2字節與第一字節合起來的雙字節應能被31整除,詳見rfc1950。例如Firefox的zlib假頭為0x7801,python zlib.compress()成績頭部為0x789c。        


        deflate 是最根蒂根基的算法,gzip 在deflate 的raw data 前增加了10 個字節的gzheader,尾部添加了8 個字節的校驗字節(可選crc32 和adler32) 和長度標識字節。


        安裝它們的Apache Web服務器版本的差異。Apache 1.x系列沒有內建網頁壓縮技術,所以才去用額外的第三方mod_gzip 模塊來履行壓縮。而Apache 2.x官方在開辟的時刻,就把網頁緊縮斟酌進去,內建了mod_deflate 這個模塊,用以庖代mod_gzip。雖然二者都是利用的Gzip緊縮算法,它們的運作道理是近似的。     


 

        緊縮質量。mod_deflate 緊縮速度略快而mod_gzip 的緊縮比略高。一般默許情形下,mod_gzip 會比mod_deflate 多出4%~6%的緊縮量。


        對辦事器資本的佔用。一般來講mod_gzip對辦事器CPU的佔用要高一些。mod_deflate是專門為確保辦事器的機能而利用的一個緊縮模塊,mod_deflate需要較少的資本來緊縮文件。這意味著在高流量的服務器,利用mod_deflate可能會比mod_gzip加載速度更快。即在辦事器機能足夠的環境下,使用mod_gzip,固然會耗費辦事器性能,可是值得(緊縮更快更好);在辦事器機能不足的情況下,利用mod_deflate  確保性能。


 

        從Apache 2.0.45最先,mod_deflate 可以使用DeflateCompressionLevel 指令來設置緊縮級別。該指令的值可為1(緊縮速度最快,最低的壓縮質量)至9(最慢的壓縮速度,緊縮率最高)之間的整數,其默許值為6(緊縮速度和壓縮質量較為平衡的值)。這個簡單的轉變更是使得mod_deflate 可以輕鬆媲美mod_gzip 的緊縮。



5、開啟mod_gzip、mod_deflate

        Apache上行使Gzip壓縮算法進行緊縮的模塊有兩種:mod_gzip 和mod_deflate。要使用Gzip Web壓縮,請起首確定你的辦事器開啟了對這兩個組件之一的撐持。在Linux服務器上,現在已有愈來愈多的空間商開放了對它們的支持,有的乃至是同時支持這兩個模塊的。例如目前Godaddy、Bluehost及DreamHosts等空間商的辦事器都已同時撐持mod_gzip 和mod_deflate。        


 

        通過查看HTTP頭,我們可以快速判定使用的客戶端瀏覽器是否撐持接管gzip壓縮。若發送的HTTP頭中呈現以下信息,則表明你的瀏覽器支撐接管響應的gzip緊縮:


    Accept-Encoding: gzip 支撐mod_gzip    Accept-Encoding: deflate 支撐mod_deflate     Accept-Encoding: gzip,deflate 同时撐持mod_gzip 和mod_deflate

        mod_deflate 是apache自帶的模塊,固然是在apache 2後支持的,之前1的時候是mod_gzip,啟用mod_deflate可以很好的為節省網頁巨細,只不過是佔用辦事器的資本和內存.用戶看到頁面的速度會大大加快。在apache2.0以上(包孕apache2.0)的版中gzip壓縮利用的是mod_deflate模塊


1.查看apache的安裝模式

apachectl -l


發現mod_so.c,ok可以動態加模塊,不消重新編譯。


2.安裝mod_deflate

找到原本的apache安裝包安裝mod_deflate

cd httpd-2.0.59/modules/filters

/usr/local/apache2/bin/apxs -i -c -a mod_deflate.c


PS:apxs命令參數申明:

        -i此選項透露表現需要履行安裝操作,以安裝一個或多個動態同享對像到服務器的modules目次中。

        -a此選項自動增添一個LoadModule行到httpd.conf文件中,以激活此模塊,或,若是此行已存在,則啟用之。

        -A與-a選項類似,可是它增添的LoadModule敕令有一個井號前綴(#),即此模塊已經準備就緒但還沒有啟用。

        -c此選項透露表現需要履行編譯操作。它起首會編譯C源法式(.c)files為對應的目標代碼文件(.o),然後毗鄰這些目的代碼和files中其餘的方針代碼文件(.o和.a),以生成動態共享對象dsofile 。若是沒有指定-o選項,則此輸出文件名由files中的第一個文件名推想獲得,也就是默許為mod_name.so 。


 

3、修改Apache的http.conf文件,去除mod_deflate.so前面的註釋


在您的主機下建立以下論述:





  1. <IfModule mod_deflate.c>

  2.   AddOutputFilterByType DEFLATE text/html

  3.   AddOutputFilterByType DEFLATE text/css

  4.   AddOutputFilterByType DEFLATE text/javascript

  5.   AddOutputFilterByType DEFLATE text/xml

  6.   AddOutputFilterByType DEFLATE text/plain

  7.   AddOutputFilterByType DEFLATE image/x-icon

  8.   AddOutputFilterByType DEFLATE image/svg+xml

  9.   AddOutputFilterByType DEFLATE application/rss+xml

  10.   AddOutputFilterByType DEFLATE application/javascript

  11.   AddOutputFilterByType DEFLATE application/x-javascript

  12.   AddOutputFilterByType DEFLATE application/xml

  13.   AddOutputFilterByType DEFLATE application/xhtml+xml

  14.   AddOutputFilterByType DEFLATE application/x-font

  15.   AddOutputFilterByType DEFLATE application/x-font-truetype

  16.   AddOutputFilterByType DEFLATE application/x-font-ttf

  17.   AddOutputFilterByType DEFLATE application/x-font-otf

  18.   AddOutputFilterByType DEFLATE application/x-font-opentype

  19.   AddOutputFilterByType DEFLATE application/vnd.ms-fontobject

  20.   AddOutputFilterByType DEFLATE font/ttf

  21.   AddOutputFilterByType DEFLATE font/otf

  22.   AddOutputFilterByType DEFLATE font/opentype

  23.  

  24. # For Olders Browsers Which Can't Handle Compression

  25.   BrowserMatch ^Mozilla/4 gzip-only-text/html

  26.   BrowserMatch ^Mozilla/4\.0[678] no-gzip

  27.   BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

  28. </IfModule>



複製代碼



或是在.htaccess檔案建立敘述



  1. #GZIP压缩模块配置<ifmodule mod_deflate.c>

  2. #启用对特定MIME类型内容的压缩

  3. SetOutputFilter DEFLATESetEnvIfNoCase Request_URI .(?:gif|jpe?g|png|exe|t?gz|zip|bz2|sit|rar|pdf|mov|avi|mp3|mp4|rm)$ no-gzip dont-vary #设置不对压缩的文件AddOutputFilterByType DEFLATE text/html text/css text/plain text/xml application/x-httpd-php application/x-javascript #设置对压缩的文件</ifmodule>



複製代碼



如要增添檔案刻日插手代碼



  1. <IfModule mod_expires.c>

  2.     ExpiresActive on

  3.     ExpiresByType image/jpg "access plus 1 month"

  4.     ExpiresByType image/jpeg "access plus 1 month"

  5.     ExpiresByType image/gif "access plus 1 month"

  6.     ExpiresByType image/png "access plus 1 month"

  7.     ExpiresByType text/javascript "access plus 1 month"

  8.     ExpiresByType application/javascript "access plus 1 month"

  9.     ExpiresByType text/css "access plus 1 month"

  10. </IfModule>



複製代碼







5、對指定的文件配置緩存的糊口生涯時候,去除mod_headers.so模塊前面的註釋
Apache配置文件路徑是:/usr/local/apache/conf/httpd.conf

 

打開此文件查找如下兩行代碼:




  1. LoadModule deflate_module modules/mod_deflate.so

  2. LoadModule headers_module modules/mod_headers.so



複製代碼

前面沒有#符號即為正常的,若是有#符號則表示被註釋掉了,刪除前面的#符號即可。

在Apache 配置文件/usr/local/apache/conf/httpd.conf 的最後添加:




  1. <IfModule deflate_module>

  2. SetOutputFilter DEFLATE

  3. SetEnvIfNoCase Request_URI .(?:gif|jpe?g|png)$ no-gzip dont-vary

  4. SetEnvIfNoCase Request_URI .(?:exe|t?gz|zip|bz2|sit|rar)$ no-gzip dont-vary

  5. SetEnvIfNoCase Request_URI .(?:pdf|doc|avi|mov|mp3|rm)$ no-gzip dont-vary

  6. AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css

  7. AddOutputFilterByType DEFLATE application/x-javascript

  8. </IfModule>



複製代碼

註解:

IfModule deflate_module是判定假如deflate_module模塊加載的話,執行里面的設置裝備擺設。

SetOutputFilter DEFLATE是設置輸出為deflate壓縮算法。

SetEnvIfNoCase Request_URI是排除一些常見的圖片,影音,文檔等類型的後綴,不緊縮。

AddOutputFilterByType DEFLATE是對常見的文本類型,如html,txt,xml,css,js做緊縮處理。

6、在根目次中新建.htaccess文件,定制緊縮規則

 



  1. #文件缓存时间設置裝備擺設

  2. <FilesMatch ".(flv|gif|jpg|jpeg|png|ico|swf|js|css)[        DISCUZ_CODE_2        ]quot;>

  3. Header set Cache-Control "max-age=2592000"

  4. </FilesMatch>



複製代碼



裡面的文件MIME類型可以根據本身情況添加,至於PDF 、圖片、音樂文檔之類的這些本身都已高度緊縮花式,反複壓縮的感化不大,反而可能會因為增加CPU的處置懲罰時候及瀏覽器的襯著問題而下降機能。所以就沒必要再經由過程Gzip壓縮。經由過程以上設置後再查看返回的HTTP頭,呈現以下信息則註解返回的數據已過緊縮。即網站法式所設置裝備擺設的Gzip緊縮已生效。



Content-Encoding: gzip

注:不管利用mod_gzip 還是mod_deflate,此處返回的信息都一樣。因為它們都是實現的gzip壓縮體例。








遇到的問題和解決:



1:apach2 安裝mod_deflate後restart,直接



load /opt/apache/modules/mod_deflate.so into server: /opt/apache/modules/mod_deflate.so: undefined symbol: deflate 異常的痛苦



什麼ldd mod_deflate.so後再export LIB_LIBRARY_PATH呀,都試了N次,google也go了N天



終於在google上go出來一篇文章,終於解決,方式以下: vi /usr/local/apache2/bin/apr-config 點竄LDFLAGS=" " 為LDFLAGS="-lz" 然後再apxs -ica mod_deflate.c 就OK了.



2:apach2安裝mod_deflate後restart,直接



module deflate_module is built-in and can't be loaded ...



這申明該模塊已安裝,不必再LoadModule deflate_module啟用它。



只需做<ifmodule mod_deflate.c>配置




參考文章

https://my.oschina.net/rasine/blog/343769

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

CPanel SMTP 寄信時顯現毛病沒法寄出 網頁設計
昨日要寄信到GMAIL信箱

發現CPanel SMTP呈現毛病

reyesoe2k3v6 發表在 痞客邦 留言(0) 人氣()

Blog Stats
⚠️

成人內容提醒

本部落格內容僅限年滿十八歲者瀏覽。
若您未滿十八歲,請立即離開。

已滿十八歲者,亦請勿將內容提供給未成年人士。