カスタムヘッダー

is_front is_home

http://araishi.com/color/

webfont

cssだけできれいなボタン

if ($favorite_post_ids):

    $i=0;
    if($_GET['orderby']=='date' || !isset($_GET['orderby'])){
        $favorite_post_ids = array_reverse($favorite_post_ids);
    }
    if($_GET['orderby']=='title'){
        $post_title_tab = array();
        foreach ($favorite_post_ids as $post_id) {
            $post_info = get_post($post_id);
            $post_title_tab[$post_info->post_title] = $post_id;
        }
        ksort($post_title_tab);
        unset($favorite_post_ids);
        foreach ($post_title_tab as $title=>$id) {
            $favorite_post_ids[] = $id;
        }
    }
    if($_GET['r_sortby']=='highest_rated'){
        $post_rating_tab = array();
        foreach ($favorite_post_ids as $post_id) {
            $post_info = get_post($post_id);
            $post_rating_tab[get_post_meta($post_id, 'ratings_average', true)] = $post_id;
        }
        krsort($post_rating_tab);
        unset($favorite_post_ids);
        foreach ($post_rating_tab as $rate=>$id) {
            $favorite_post_ids[] = $id;
        }
    }

違いにはなりません。 …文法的には間違いにならないのですが、今回のトラブルの原因は実はコレでした。

Webkitのjs実行タイミングの関係で、読み込んだ画像を実際に配置する前にheight()の処理をしてしまうらしく、width属性とheight属性がない場合には、代わりに代替文章(alt属性)を基に高さを出してしまっているようでした。

問題の解決方法は2つ。

ちゃんとwidth属性とheight属性を書く jsの実行タイミングを変える。

onloadイベントハンドラとして記述する

この場合はページ読み込み完了後、すなわちDOMツリー構築、タグによる画像ファイルの外部リソースのロードなどすべて完了した時点でスクリプトが実行される。

demo.js // htmlは先程と同じ window.onload = function() { var a = document.getElementById(‘a’); console.log(a != null); // true var b = document.getElementById(‘b’); console.log(b != null); // true <- 注目 };

jQueryのready()メソッド DOMツリーの構築が完了した時点で処理を実行する。 onloadイベント DOMツリーの構築だけでなく、画像などの関連データの読み込みが完了しないと処理を実行しない。

入門記事の多くで、基本的に $(function(){}); にコード書けと言われますが、 window.onloadを使ったほうが良いケースも結構あります。
たとえば、
画像を含む要素の高さを取得したい。
CSSで設定された結果に対して何らかの操作をおこないたい。
とか。

スポンサーリンク

Leave a Reply