2012年12月14日

jQueryで複数の要素の高さを揃える

またも嵌ったのでメモ。 今回はULリストの子要素LIの高さを揃えようとやってみた。
$('ul').each(function(){
 var rep = 0;
 $(this).children().each(function(){
  var itemHeight = parseInt($(this).height());
  if(itemHeight > rep){
   rep = itemHeight;
  }
 });
 $(this).children().css({height:(rep)});
});
こんな感じ(で合ってるはず)。
 ローカル環境で正常に動作したのでリモートにアップしたらなぜか正確に高さを測ってくれない。しかもChromeだけ! いろいろ調べてみたところ、どうもロード時間に問題があるらしい。

結論としては:
  • 高さを揃えたりするなら、ページが全てロードされた後に計算させないと正しく動かない(こともある)。
  • $(window).load()で対処。
jQuery(function($) {
    $(window).load(function() {
  $('ul#sample').each(function(){
   var rep = 0;
   $(this).children().each(function(){
    var itemHeight = parseInt($(this).height());
    if(itemHeight > rep){
     rep = itemHeight;
    }
   });
   $(this).children().css({height:(rep)});
  });
 });
});
これはローカル環境だとページロードが早かったから表面化しなかった問題。
論理的に考えれば理屈はわからなくはないんだけど、IE,Firefox,Operaで動いてChromeが動かないのは初めての現象でびっくりした。逆は多いのに・・・(苦)
Chromeの方が正しくjavascriptを理解してるってことなの、これ?

2012年11月28日

CodeIgniter + IDE

開発をする際にコード補完機能のあるIDEを使っている方もいるかと思います。
IDEにもよりますがコード補完機能がCodeIgniterを上手く補足してくれない場合には以下のようにするとコード補完機能が動くようになります。

*IDEによっては動かない場合もあります。

1. コントローラを拡張して以下のようにコメントを追加。
<?php
/**
 * @property DB_active_record $db
 * @property DB_forge $dbforge
 * @property Benchmark $benchmark
 * @property Calendar $calendar
 * @property Cart $cart
 * @property Config $config
 * @property Controller $controller
 * @property Email $email
 * @property Encrypt $encrypt
 * @property Exceptions $exceptions
 * @property Form_validation $form_validation
 * @property Ftp $ftp
 * @property Hooks $hooks
 * @property Image_lib $image_lib
 * @property Input $input
 * @property Language $language
 * @property Loader $load
 * @property Log $log
 * @property Model $model
 * @property Output $output
 * @property Pagination $pagination
 * @property Parser $parser
 * @property Profiler $profiler
 * @property Router $router
 * @property Session $session
 * @property Sha1 $sha1
 * @property Table $table
 * @property Trackback $trackback
 * @property Typography $typography
 * @property Unit_test $unit_test
 * @property Upload $upload
 * @property URI $uri
 * @property User_agent $agent
 * @property Validation $validation
 * @property Xmlrpc $xmlrpc
 * @property Xmlrpcs $xmlrpcs
 * @property Zip $zip
 * 
 * その他のライブラリ、モデルなどを以下に追加。
 * 
 */
class MY_Controller extends Controller
{
    function __construct()
    {
        parent::__construct();
    }
}

2. ページ用のコントローラは拡張したコントローラを使用する。
<?php
class Classname extends MY_Controller
{
    function __construct()
    {
        parent::__construct();
    }
}

2012年11月27日

コアコントローラの拡張

少し嵌ったのでメモ。

app/core/Mage/--Any of Core Directory--app/local/Mage/--Any of Core Directory-- に置いたら勝手に動くのかと思ったら、コントローラだけ動かない。
どうやらブロックやモデルなんかは自動で判別してくれるらしいけど、コントローラはダメらしい。(ソース

となると普通に拡張するしかないんだけど、ここで少し嵌った。
どうもいろんな人が書いてる情報が古くなってるみたい(?)

1. app/code/local/--Name-Space--/--Module--/etc/config.xml
2. app/code/local/--Name-Space--/--Module--/controllers/--Core-Directory--/--Controller-File--.php
3. app/etc/modules/--Name-Space--_All.xml

(1),(2)は従来通りだけど、(3)が変わってる模様。
以前は --Name-Space-.xml で動いてたけど、今は --Name-Space--_All.xml にする必要があるみたい。

検証してないから定かではないけれど、 app/etc/modules/Mage_All.xml に入ってるものは上の通りにする必要があるんじゃないかなぁ・・・たぶんo( ̄ー ̄;)ゞ


コントローラの拡張の仕方はこちらのページに詳しく載ってます(英文)。


*このページの情報は不正確かもしれないので、鵜呑みにせず情報の1つとして捕らえてください。

2012年11月26日

コンタクトページにパンくずリストを表示する

ファイル:
app/design/frontend/--your theme--/default/layout/contacts.xml

contacts_index_index 内に以下のような記述を追加。

<contacts_index_index translate="label">
...
 <reference name="breadcrumbs">
  <action method="addCrumb">
   <crumbName>Home</crumbName>
   <crumbInfo>
    <label>Home</label>
    <title>Home</title>
    <link>/</link>
   </crumbInfo>
  </action>
  <action method="addCrumb">
   <crumbName>Contacts</crumbName>
   <crumbInfo>
    <label>Contact Us</label>
    <title>Contact Us</title>
   </crumbInfo>
  </action>
 </reference>
...
</contacts_index_index>
ハードコードではあるけど、一応追加は完了。 特別、ダイナミックにパンくずリストを生成する必要がない限りはこれで対応できるはず。