ページ全体が再読み込みされないようにする方法
こんにちは。
Drupal 7 用のテーマを作成しています。今のところすべて順調です。いくつか質問が浮かびました。
私のテーマについて少し説明します。
primary_links リージョンに(コンテンツタイプを選択する)メインメニューがあります(そして header リージョンにも)
メインメニューによって変わる、特定のビューの記事をナビゲートするメニューがあります(left_column リージョンと main-wrapper リージョンに)
さらに、メインメニューに応じて特定のコンテンツタイプが表示されるコンテンツカラムがあります(right_column リージョンと main-wrapper リージョンに)
質問1
primary links で選択したときに、構造的にその下にあるリージョンだけを再読み込みさせるにはどうすればよいですか。つまり main-wrapper リージョンだけです。
そして left_column リージョンで選択したときには、right_column リージョンだけが再読み込みされるようにしたいのです。
Ajax を使う必要があるのは理解していますが、このテーマに関する分かりやすい情報は見つけられませんでした。
質問2
左カラムに特定のコンテンツタイプ(特別なビュー・フォームのリスト)を表示させるにはどうすればよいですか。リストはメインメニューの各項目ごとに異なり、それに応じて右カラムでは左カラムで選択された要素に応じたものを表示させたいです。
質問3
3つのカラムを作りましたが高さがバラバラです。同じ高さにしたいです。整形には Div を使っています。
page.tpl.php(Drupal 7 使用)では次のコードを使っています
<script language="JavaScript" type="text/javascript">
function setEqualHeight(columns){
var tallestcolumn = 0;
columns.each(function(){
currentHeight = $(this).height();
if(currentHeight > tallestcolumn){
tallestcolumn = currentHeight;
}
}
);
columns.height(tallestcolumn);
}
$(document).ready(function() {
setEqualHeight($(".container > div"));
});
</script>
この厄介事は結局、昼食後に解決しました :) Drupal 7 では $ と書くのが嫌われるようです。
$ を jQuery に置き換えると、すぐにすべてうまく動きました。
読んだところによると、原因は jQuery が noConflict モードで動作しているためだそうです
コードはおおよそ次のような形になるはずです
jQuery(document).ready(function() {
setEqualHeight(jQuery(".container > div"));
});
そしてどこでも $ を jQuery にすれば幸せになれます。
誰かの役に立てば嬉しい情報です。
最初の2つの質問はまだ未解決のままです。
- コメントを投稿するにはログインしてください