読者です 読者をやめる 読者になる 読者になる

東京の会社辞めて地方で生きるわ。

勢いで会社を辞めて縁のない地方で生きることはできるのか

fontplus フォントプラスの使い方

①まず以下にアクセスしてログイン。
https://webfont.fontplus.jp/users/login

②グローバルナビの「スマート」の「サイト登録・PV数レポート」をクリックしてURLを登録

③グローバルナビ「フォント一覧」をクリックして使いたいフォントを探す。そしてコードをコピーボタンを押してコピーしてcssに張り付けばOK

jquery callback コールバック queue 使いかた

下記コードは、
#bg_fvがフェードイン後に#logo_indexがフェードイン。そのあとに.home #g_naviがfadeInされる。

最後にdequeueを。

$('#bg_fv').fadeIn(1000).queue(function () {
        $('#logo_index').fadeIn(500).queue(function () {
            $('.home #g_navi').fadeIn(500).dequeue();
        });
});

【参考URL】

http://tsmd.hateblo.jp/entry/2013/01/17/214018

背景画像を読み込んだら処理 imagesloaded

まずプラグインimagesloaded読み込み

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/3.2.0/imagesloaded.pkgd.min.js"></script>

そして以下。

$(function(){
  $('#bg_fv').imagesLoaded( { background: true }, function() {
	$('#bg_fv').fadeIn(1000);
  });
});


【背景画像】
https://www.imd-net.com/blog/2016/03/01-233812/

【jQuery】lazyload使い方

head内にlazyloadのプラグインjs読み込ませる。

以下はオプションでカスタムのイベントloadImgをつくってる。
kikaku1をクリックすると、lazyloadが始まる。(img.lazyの画像読み込みが始まる)

data-originalに本命のimgを。srcにloading中の画像を

<img src="dummy.png" class="lazy" data-original="honmei.jpg" alt="*" />
$(function(){
  $('img.lazy').lazyload({
    effect: 'fadeIn',
    event: 'loadImg'
  });


  $( '.kikaku1' ).on( 'click', function(){
    $("img.lazy").trigger("loadImg");
  });

});


【参考URL】
http://www.webdesignleaves.com/wp/jquery/1335/

http://cly7796.net/wp/javascript/plugin-jquery-lazyload/

【EC-CUBE2系】コメントアウト

<!--{* ここがコメントアウトされる *}-->

http://qiita.com/tomcky/items/d947c26786d7269f5cf3

グリッドジェネレーター

http://gridulator.com/(こっち使うかな)

http://www.kenjisugimoto.com/gridpx/

【CSS3】 transform プロパティを使って CSS アニメーションを実行した際に要素がガタつくのを防ぐ方法

.element{
    -webkit-transform: translatez(0);
    // 又は
    -webkit-transform: translate3d(0,0,0);
}

【参考URl】
http://memocarilog.info/webdesign/8304