2013年2月25日月曜日

reset.cssについて

Yahoo!のリセットCSSを使ってみて気になったこと。
（しょーもない話）


<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.6.0/build/cssreset/cssreset-min.css">

cssreset-min.css　では

html　{color:#000;background:#F00}

という指定がされている。
このリセットCSSを使用した場合


html,body {height:100%;}

と設定したとき、ウィンドウサイズよりコンテンツが広く、隠れているコンテンツを表示させるためにスクロールした時、新たに表示される画面の背景が白くなる（背景が途切れているように見える）




※そもそも　height:100%　を設定するのはウィンドウサイズいっぱいにリキッドレイアウトでコンテンツを配置したい（フッター要素を画面下部に固定したいとか）場合なので今回は必要でなかった。


body の指定　height:100%;　を無くせばスクロール時の白い背景はでなくなるが、ウィンドウサイズを広げたとき、コンテンツの縦がウィンドウサイズより小さい場合、広げた領域に　background:#F00　の影響がでる（白くなる）




cssreset-min.css　が修正できる状態なら

html　{color:#000;}　

として背景指定を無くせば　body　での指定が有効になる。

修正できない場合は　別CSSファイル内で　backgroundプロパティを上書きする。

html　{color:#000;background:none;}


その上で body　の設定を記述する。


body {background:#d0d0c8 url(../img/back.png) fixed no-repeat center top;}



投稿者 時刻: 15:23 0 コメント

2013年2月21日木曜日

「きのう何食べた？」インデックス

「きのう何食べた？」のレシピを時々参照するのであるが、どこに何が掲載されたかいつも探すので、頻度の高いものをインデックスしておく。


■ときどきつくるので、その都度確認するレシピ

たまねぎたっぷり豚の生姜焼き　4巻

セロリと牛肉のオイスター炒め　2巻

肉豆腐　3巻

キャペツとあさりベーコン　3巻

煮込みハンバーグ　4巻




■こっちはもう見なくてもいいかなと思うけどそれなりの頻度で作るので

ナポリタン　4巻


ながねぎのコンソメ煮　4巻

投稿者 時刻: 11:40 0 コメント

2013年2月13日水曜日

jQuery winndowの右端までスクローラが移動したら最初にもどる



横スクロールでwinndowの右端までスクローラが移動したら最初にもどってループする
（左に移動して、コンテンツの最後に移動はしない）

コメントがすごいくどいけど、意外とどこに書いたらいいの？という人もいるだろうし、いちいち説明が必要な人もいると思うので（自分だ）、備忘録として。


<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>


<script type="text/javascript">

$(function() {

//ページの幅を取得 
var contentsW = $(document).width();

//スクロールされたときに関数実行
$(window).scroll(function(){

//ウィンドウの幅を取得
var windowW =$(window).width();

//ウィンドウ内のスクローラー位置
var sPos = $(this).scrollLeft();

//ウィンドウの幅+スクローラーの量、※スクローラーは隠れているコンテンツの幅まで移動する 
var allwidth = windowW + sPos;

//スクローラーの位置が画面幅を超えたらページを戻す
 if(contentsW <= allwidth) {
  $(window).scrollLeft(0,0);
 }   //if文閉じカッコ
 }); //　スクロールされた時の関数の閉じカッコ

});  //全体の閉じカッコ

</script>

</head>

投稿者 時刻: 23:22 0 コメント

2013年2月9日土曜日

Lightboxで記述したtitle属性をツールチップで表示させない

サムネイル画像をLightboxの機能を使ってクリック時に拡大表示したとき、title属性に記述したテキストがキャプションで表示される。

その画像にマウスオーバーしたときにツールチップでそのテキストも表示されてしまう。
簡潔なものならいいのだけど、ある程度長い文章になると、見苦しくなってしまう。



それでいろいろと調べてみた。

jQuery tooolでツールチップのカスタマイズできるので、これでなんとかなりそうかと思った。
ｊQuery tools,jQuery tools日本語リファレンス,日本語リファレンス

ツールチップ表示自体はいらないので、opacity:0　で表示を見かけ上隠してしまえはいいかと考えたのだが（あまりいい方法ではないのは承知）、title属性データを横取り（？）してしまうらしくLightboxのキャプション表示自体もなくなってしまったのでボツ。

Javascriptでブラウザの機能を制限できないかと思ったが、これも該当する手段を見つけられず。

それでも色々検索していたら、こんなシンプルな解決方法が見つかった。

around design
Lightboxやfancyboxのtitle属性をポップアップさせない

画像の　imgタグ　に　title属性をつけると、そちらが優先的に表示される.


だがimg属性のtitleを空欄にしてしまうと　aタグのtitle属性が表示されてしまう。



スペースを入れておくと空欄の小さいツールチップが表示される（これもちょっと不審な感じ）。



長い文章が表示されるよりましなので、簡潔なタイトルを入れておくことがよいと思われる。


完全に消すことは出来なかったけど、まあまあの解決。
投稿者 時刻: 23:38 0 コメント

2012年4月29日日曜日

ブラウザの種類を判別、別ページに移動

いまさらですが、この処理が必要になったのでメモ

以下のサイトを参照

WinOfSql　SQLの窓
http://winofsql.jp/VA003334/infoboard.php?id=070828100942&mid=sjscript&pid=3


リンク先が変わったり無くなったりした時の為にコピー＆ペーストしておきます

<SCRIPT type="text/javascript">

 var userAgent = window.navigator.userAgent.toLowerCase();
 var appVersion = window.navigator.appVersion.toLowerCase();

 if (userAgent.indexOf("msie") > -1) {
  if (appVersion.indexOf("msie 6.0") > -1) {
   alert("IE6");
  }
  else if (appVersion.indexOf("msie 7.0") > -1) {
   alert("IE7");
  }
  else if (appVersion.indexOf("msie 8.0") > -1) {
   alert("IE8");
  }
  else {
   alert("Unknown");
  }
 }
 else if (userAgent.indexOf("firefox") > -1) {
  alert("Firefox");
 }
 else if (userAgent.indexOf("opera") > -1) {
  alert("Opera");
 }
 else if (userAgent.indexOf("chrome") > -1) {
  alert("Google Chrome");
 }
 else if (userAgent.indexOf("safari") > -1) {
  alert("Safari");
 }
 else {
  alert("Unknown");
 }

</SCRIPT>
投稿者 時刻: 11:03 0 コメント

2012年2月26日日曜日

ハギエンナーレ　記憶のモニュメント


築50年以上の木造アパート「萩荘」が解体に向けて閉鎖される。
ここ数年は東京藝大生の住居およびアトリエとして使用されていたとのことだ。

建物の閉鎖前に、その場を展示空間として開催されている展覧会が「ハギエンナーレ2012」だ。

古い場に存在する「時間の集積」という力に対してどうアプローチしていくかがこの種の展示の一つの見どころであろう。
それは住んだ場所に対しての愛着であったり、歴史の醸し出す雰囲気だったり、時間をかけねば作り上げられない経年変化だったりと様態は様々であるが、往々にして置かれる作品そのものより魅力的だったりもする。

はたしてハギエンナーレはどうか？

萩荘、というオブジェクトが作りだす空間の印象は奇妙な簡素さ、というべきか。
個別の作家性はイイ意味でもワルイ意味でも消失し、萩荘というオブジェクトに回収され、ハギエンナーレという時空間として成立しているようだ。

破壊される建物を使用するのであれば、ある種の破壊行為を創造的行為に結びつける事が考えられそうだが、あまりそういった行為は目につかない。
ウェットにならず、作家たちの静かな感情がそこに置かれているように感じられる。

話が飛躍するが、その静けさは、もしかしたら物心がついた頃からパーソナルコンピュータがツールとして存在した世代の感覚の表れなのかもしれない。
重要なのはハードウェアではなく、そこに存在するデータである。
ハードウェアが使えなくなったり、古くなったら新しいものに換えればよい。
古くなったハードウェア（萩荘）から新たなハードウェア（新天地）に乗り換えるのは肯定されるべきことである。
そういったドライな感覚が存在するように感じる。

とはいうものの、古くなった「モノ」の破棄は何らかの心理的負荷をもたらすはずだ。
それを鎮めるのは儀式であり、忘れずに記憶にとどめておく、という事が鎮魂の手段に他ならない。
死者を忘れ無い事が死者を弔う最良の方法のように。

萩荘を記憶のモニュメントとしてとどめておく事が「ハギエンナーレ」という一種の儀式なのであろうし、それは十分に達成しているだろう。
萩荘は住人達に十分に愛されていたのだ。



投稿者 時刻: 21:17 0 コメント

2012年2月24日金曜日

MOLESKINE　のペンケース（？）

MOLESKINEをここ数年使用しているが、ペンを一緒に持ち歩くのがいまいちに感じていた。
オフィシャルなツールもあったけど
http://www.moleskine.co.jp/Online-Shop/Writing_2
食指が動かなかった。
なので簡単に作ってみた。






















ノートの厚みを増加させるような形状を避けたかったので、
ペンを差せるようにした円筒形の部分がノートの小口に密着する形。
栞代わりにもなる。

しばらく使ってみないと何とも言えないけど、
思いつきで作った割にはイイ感じがする。

投稿者 時刻: 23:52 0 コメント
登録: 投稿 (Atom)