サイト作成メモ #02
_{2015年3月～2017年3月まで運営したFC2ホームページ作成メモ}

20 Back to Top -jQuery-

「トップにヌルッと戻る」jQueryを実装。

<script>
$(function(){
var pageTop = $("#page-top");
pageTop.click(function () {
$('body, html').animate({ scrollTop: 0 }, 1000);
return false;
});
$(window).scroll(function () {
if($(this).scrollTop() >= 600) {
pageTop.css( "transform", "rotateY(0deg)" );
} else {
pageTop.css( "transform", "rotateY(270deg)" );
}
});
});
</script>

19 Googleカスタム検索2 実装

読み込みに非常に時間が掛かるし、埋め込みコードを貼り付けてもリセットCSSとの関係かテキスト入力エリア位置がずれたりして使いにくい。そこで「HTML フォームを使用した検索ボックスの作成」というページなどを参考にフォームに固有のサーチエンジンIDを埋め込み方法を実施。

input要素にidを付けてCSSでスタイリングした。ただ、chrome以外のブラウザではテキスト入力エリアと検索ボタンが位置ズレを起こすのでズレを起こすinputタグをそれぞれdivタグで囲み、position(relative)で位置調整することで解決。[2015.02.05]

18 親の透過性が子に継承されるっ？！

親要素にopacityを設定すると子の要素にもその値が継承される。調べたらopacityの代わりにrgba(x,x,x,0.7)で指定するいいらしいというのでやってみたら継承されなくなった。

17 FC2ロゴのためのフッターのグラデーション処理

FC2ホームページではフッター領域の更にした領域に「Powered by FC2.com」と白地のロゴが表示されるのでの境界をグラデーションにした。しかし、後にデザインが気に入らないために削除。

16 Firefoxでの不具合2

トップメニューのデザインを完成させて動作確認したところ、またもやFirefoxだけおかしな挙動になる。具体的にはjQueryのtoggle("clip")でブラウザの中央でウィンドウを開閉させているんだが、firefoxだけ左端で開き始めてしまう。width="100%"にして横幅いっぱいに広がるように修正。

15 Firefoxでの不具合1

Firefoxでフローティングウィンドウがトップメニューの横に回り込むという不具合をどうしても解決できないので大幅にデザイン変更を余儀なくされる。元々は画面をスクロールするとヘッダー下にあるのメニューバーがスクロールの途中でトップに固定されると言うスクリプトにしていたが最初からfixedでトップに固定することにした。

14 IE11にてYouTube(flash)にz-indexが効かない

IE11で埋め込んだYouTube(flash)画面のz-indexを設定してもが効かない。YouTubeの埋め込みコードを「?」で繋いで「&wmode=transparent」のコードを追加することで解決。

13 メールフォーム経由でスパムメール

公開してないメールフォーム宛に何故かスパムメールが2件届く～。((((；ﾟДﾟ))))ｶﾞｸｶﾞｸﾌﾞﾙﾌﾞﾙ

12 メールフォーム設置

メールフォームを一から作るのは面倒そうなのでデザインはイマイチだが取り敢えずFC2メールフォームを利用することにする。
※SSLに非対応なので削除しました

11 BBS設置

デザインがおしゃれな掲示板(BBS)を見つけたのでサイトカラーに合うように色を少しだけカスタマイズして設置する。

FC2 BBS(掲示板)
※SSLに非対応なので削除しました