<ul><li>Drupalのブロックシステムにある「ハイライトされ」エリアにTwitterなどのフォローボタンを配置したいですが、テーマ（Bootstrap）のjumbotron、wellクラスよりハイライトエリアの表示バランスが崩れます。</li>
<li>javascriptでページロード時に特定なクラス（jumbotron, well）を削除します。</li>
</ul>

<ul><li>問題点：Views Bootstrapのブレイクポイント設定が乏しい、設定されたブレイクポイントは画面1200基準（col-lg-xx）のものとなりました。</li>
<li>BootstrapのグリッドシステムがPC、タブレット、スマホのサイズに応じてカラム数を変更するのは本来の機能を活かすことができないです。</li>
<li>ここで、ｊａｖａｓｃｒｉｐｔ（ｊＱｕｅｒｙ）でページがロード時に、ブレイクポインを動的に追加します。例：col-sm-x, col-xsなどの属性をクラスの追加します。</li>
</ul>

<ul><li>Bootstrap導入後にモジュール（Better Exporsed Filters）のレイアウトが崩れました。</li>
<li>原因：Better Exposed Filtersの検索フォームの要素、プロパティがBootstrapテーマに書き直されました。</li>
<li>Bootstrapの「form-control」クラスがブロックの高さ（height）が定義しています。</li>
<li>「form-control」クラスがブロックの高さ（height）を消せば、通常の検索フォームに戻りました。</li>
</ul>

<h2>やりたいこと：画面サイズが変更（PC、スマホなど全デバイスの画面対応）時にposition:absolute要素の上下ポジションを保持したい</h2>

<ul style="margin-left: 40px;"><li>サイトの個人紹介ページに個人写真が背景イメージの上に載せする手法がよく利用されます
<ul><li>方法としては、cssで人の顔写真のプロパティ：position:absolute; top:200px などえ設定すればよいです</li>
</ul></li>
<li>ブラウザの幅が固定している場合は、ポジション（top）の固定値指定はできます</li></ul>

<h2>マウスオーバー：イメージのズームイン＋マウスクリック：イメージのズームアウト</h2>

<ul style="margin-left: 40px;"><li>マウスオーバー、クリック時のイメージのズームアウト、インの効果を作成したいです<br /><img alt="" height="338" src="/sites/pine/files/field/image/mouse-over-click-zoom-effect.gif" width="600" /></li>
</ul><h2>実現：ｃｓｓ＋jQueryで作成します</h2>

<p></p>

<h2>やりたいこと：ページがロード/スクロール時に、コンテンツがブラウザに次から次への流れ込むようなアニメ効果</h2>

<ul style="margin-left: 40px;"><li>ホームページがロード、またはスクロール時にコンテンツが一定な間隔で次から次へ流れ込むアニメ効果が比較的にコンテンツを強調しやすいです。</li>
<li>簡単なサンプルを作成して、以下のような効果となります：<br /></li></ul>

<p>FractionSliderでは、一枚のSlideに複数の画像/テキストオブジェクトが一定の時間間隔で次々に流れ込んで、Flash動画のような高い表現力として知られています。</p>

<ul><li>
<ul><li>FractionSliderの本家：<a href="http://jacksbox.de/">http://jacksbox.de/</a></li&gt;
<li>デモページ：<a href="http://jacksbox.de/fractiondemos/example_slides.html">http://jacksbox.d…;

<p>Javascriptの関数を使用するとき、関数内の変数定義時に、演算子「this」をつけるか否かは少し迷う（例：var name ⇒ var this.name?）。関数自体だけで言えば、変数の前に「this」をつける<span style="font-size: 13.0080003738403px; line-height: 20.0063037872314px;">（例：var this.name）</span>と「ローカル変数」と言う。変数の前に「this」をつけず（例： var name）に、「グローバル変数」と言うが、当該関数がプロトタイプのcall()/apply()</p>

<p>JavaScriptのanimate関数を利用して、ｃｓｓのposition属性を利用して表示物体の移動先を指定する際に、「aboslute」指定し忘れると、物体の移動がうまくいかないことがある。その場合「margin」属性の設定で物体を移動させることが可能となる。</p>

<h2>cssのleftとrightで物体移動先設定する場合にposition属性に「aboslute」を設定し忘れると物体がうまく移動しない</h2>

<ul><li>前提条件：
<ul><li>JavaScriptのanimate関数を利用して表示物体を移動する</li>
<li></li></ul></li></ul>

<ul><li>Javascriptの「this」の参照先が基本的に呼出し主に指す</li>
<li>入れ子関数の呼出し主がない場合に、その関数内の「this」がグローバルオブジェクト（window）に参照する</li>
<li>入れ子関数の呼出し主がある場合に、その関数内の「this」の参照先がその呼出し主である</li>
</ul>