WordPressテーマTCDのカスタマイズを研究するサイト

スマホ閲覧時のトップページのサムネイル表示速度が遅いとき

Q.スマホ閲覧時のサムネイルの表示速度が遅いのですが

スマートフォンでのトップページのアイキャッチ画像の表示速度が遅いと感じます。デスクトップでは問題無いのになぜスマホだけ遅いのでしょうか?
特にiPhoneよりもAndroidスマートフォンで顕著にでます。ブログの購読者の多くはスマートフォンからアクセスするので、スマートフォンでのトップページのサムネイルの表示速度をデスクトップ並みにする方法を教えていただけますか?

A.下記のphpファイルの該当箇所を編集します

当該箇所にはアニメーションが設定されていますが、デバイスによって処理速度が異なる為、表示に影響が出ることがあります。これを解消するには下記ファイルの該当箇所を削除してください。
編集するファイル:header.php
削除する箇所:

<script type="text/javascript">
 jQuery(document).ready(function($){

 $('.post_item .image_area img').each( function(i){
 var bottom_of_object = $(this).position().top + $(this).outerHeight();
 var bottom_of_window = $(window).scrollTop() + $(window).height();
 if( bottom_of_window < bottom_of_object ){
 $(this).css('opacity','0');
 }
 });

   $(window).scroll( function(){
 $('.post_item .image_area').each( function(){
 var bottom_of_object = $(this).position().top + $(this).outerHeight();
 var bottom_of_window = $(window).scrollTop() + $(window).height();
 if( bottom_of_window > bottom_of_object ){
 $(this).find('.image1 > img').delay(450).animate({'opacity':'1'}, 350,
 'easeOutQuad');
 $(this).find('.image2 > img').delay(650).animate({'opacity':'1'}, 350,
 'easeOutQuad');
 $(this).find('.image3 > img').delay(850).animate({'opacity':'1'}, 350,
 'easeOutQuad');
 $(this).find('.image4 > img').delay(1050).animate({'opacity':'1'},
 350, 'easeOutQuad');
 $(this).find('.image5 > img').delay(1250).animate({'opacity':'1'},
 350, 'easeOutQuad');
 }
 });
 });

   $(window).scroll( function(){
 var return_top_link = $('.page_navi');
 var bottom_of_object = return_top_link.position().top +
 return_top_link.outerHeight();
 var bottom_of_window = $(window).scrollTop() + $(window).height();
 if( bottom_of_window < bottom_of_object ){
 return_top_link.css('opacity','0');
 }
 if( bottom_of_window > bottom_of_object ){
 return_top_link.delay(1200).animate({'opacity':'1'}, 700, 'easeOutQuad');
 }
 });

 });

 </script>
The following two tabs change content below.

tcd

TCD LABO | WordPressテーマTCDのカスタマイズを研究するサイト

関連記事

TCD LABO ご利用上の注意

TCD LABO(ティーシーディー・ラボ)に掲載しているTCDテーマのカスタマイズ情報のご利用にあたっては、必ずカスタマイズするファイルのバックアップをご用意の上、ご利用者様責任において実施していただきますようお願いいたします。

カスタマイズの実施により生じたいかなる不具合等についてもTCD LABOはその責任を負いかねます。
何卒ご理解、ご了承の上、当サイトをご活用いただけますようお願い申し上げます。

お問合せ・ご要望

TCDLaboへのお問合せやご要望は
ご連絡フォーム をご利用ください。