ホーム > タグ > Webに関すること
Webに関すること
【CSS】iPhoneのデバッグコンソールを開くとmedia属性のorientationが効かなくなる
- 2011-02-07 (月)
- CSS | SmartPhone
iPhoneでコーディング中、 [設定]→[Safari]→[デベロッパ]→[デバッグコンソール]を”オン”にしていると、 下記のようなCSSの切り替えが効かなくなる。
<link rel="stylesheet" type="text/css" href="./css/iphone_portrait.css" media="only screen and (max-device-width:480px) and (orientation:portrait)"> <link rel="stylesheet" type="text/css" href="./css/iphone_landscape.css" media="only screen and (max-device-width:480px) and (orientation:landscape)">
原因は不明。 3GSでも4でも同様の現象が起こる。
とりあえず忘れないようにメモ。
- Comments: 0
- Trackbacks: 0
【CSS】スマートフォン向けWebサイトでdataURIが本領発揮する件
- 2011-02-04 (金)
- CSS | SmartPhone
はじめに
画像をBase24とかでエンコードしてdataURIスキームで読み込む、ってことが最近のブラウザでは可能になった訳ですが、 仕事でスマートフォン向けのサイトを作っていた際に、画像の読み込み待ちが気になったのでちょうどいいと思い試してみたところ、 驚くほど早くなった(気がした)ので実際に計ってみました。
- Comments: 0
- Trackbacks: 1
【PHP】ディレクトリを削除しようとしたらはまった
- 2011-01-19 (水)
- PHP
ファイルを書き出すスクリプトを作ってる際、 既に書き出し用のフォルダが存在していたらそのディレクトリを削除する っていう関数を作ろうと思ったらまんまとはまったのでメモ。
まずはここを参考にディレクトリ削除の関数を作ってみる。
PHP:ディレクトリを削除する|STUDIO WING .lib
function delDir($path){ if($handle = opendir($path)){ while($item = readdir($handle)){ if($item != '.' && $item != '..'){ if(is_dir("$path/$item")){ delDir("$path/$item"); //再帰 }else{ unlink("$path/$item"); echo "..."; } } } echo "<br/>"; } closedir($handle); rmdir($path); }
とりあえずこれで特に問題なく動くかと思われたものの、 数字のみ(0~の連番)のディレクトリだけ何故か削除されない模様。 色々調べてるうちに下記のエントリに行き着いた。
ディレクトリ内のファイル一覧を取得する|Affirmative Way
正しくは以下のように取得してやる PHP: readdir – Manualより引用 警告 この関数は論理値 FALSE を返す可能性がありますが、FALSE として評価される 0 や “” といった値を返す可能性もあります。詳細については 論理値のセクションを参照してください。この関数の返り値を調べるには ===演算子 を使用してください。
ということなので下記のように書き換え。
function delDir($path){ if($handle = opendir($path)){ while(false !== ($item = readdir($handle))){ //!== ってしないとディレクトリ名が"false"になることもある if($item != '.' && $item != '..'){ if(is_dir("$path/$item")){ delDir("$path/$item"); //再帰 }else{ unlink("$path/$item"); echo "..."; } } } echo "<br/>"; } closedir($handle); rmdir($path); }
これで無事削除完了。 文字列 ”0” も “==” だと false なのよね。。
というわけで2011年初エントリ。
- Comments: 0
- Trackbacks: 0
【Design】Photoshopで書き出した後サイズが増える(初歩的)
- 2010-08-25 (水)
- Design
自分用メモ
Photoshop で Web用に保存をしたとき、 Photoshop 上で「このサイズで書き出すよ!」って言ってるファイルサイズと 実際に書き出されるファイルサイズにあまりにも違いがある場合、 「Web およびデバイス用に保存」ウィンドウの中の 「メタデータ」の部分をなしにする。
書き出す際に著作権情報等を付加してしまうため、ファイルサイズが増えてしまう、というわけ。
ASSHUKUセヨ!!
- Comments: 0
- Trackbacks: 1
【PHP】ファイルをダウンロードするときに確認ダイアログを表示する
- 2010-08-20 (金)
- JavaScript | PHP
JPEGとかPNGとかの画像をダウンロードさせるページを作っていたのですが、 aタグのhrefに画像のパスを書いても、対象の画像に遷移して困ってしまいました。 ZIP等をダウンロードするときみたいに確認ダイアログを出したかったので、 色々調べてみました。
perlやPHPでファイルのダウンロード確認ダイアログを表示させる方法 | perl/CGI | 阿部辰也のブログ――人生はひまつぶし。
ここのPHPのソースを一部改変してJSからドーンします。
<? $files = $_GET; $src = "./hoge/{$files['filename']}";</p> <h1>HTTPヘッダを送信</h1> <p>if(file_exists($src)){ header("Content-type: application/octet-stream"); header("Content-Disposition: attachment; filename=\"{$files['filename']}\"");</p> <h1>出力</h1> <p>readfile($src); }else{ header("Location: ./fuga.html"); } ?>
header(“Content-Disposition: attachment; filename=\”{$files['filename']}\”"); ここの記述でダイアログを表示させる(ついでにファイル名を決めることができる)ようですが、 セキュリティ的に問題もある模様。 [Studying HTTP] HTTP Header Fields
あと、ファイルによってMIMEタイプ(Content-Type)が異なるので、それもなんとかしなければならず。 PHP の mime_content_type() を使おうとするも非推奨とのことで断念。 とりあえず application/octet-stream とすることで回避(と言えるのかわかりませんが)しました。
で、このPHPをJSから叩く
$('a.download').click(function(e){ e.preventDefault(); var filename = ($(this).attr('href')).split('/'); filename = filename[filename.length-1]; location.href = './fuga.php?filename='+filename; });firebug とかで href 書き換えられて押されたりすると怖いので、 ファイル名の部分だけを切り取って送るようにしました。
ここまでできたので、今度は欲しい画像を選んでZIPに圧縮してダウンロード、とか作りたいのですが。 さぁ、時間が無い。
■おまけ application/octet-stream とはなんぞ web用語辞典 – application/octet-stream
なんだかわからないけど何かのファイル っていう意味っぽいです。
- Comments: 0
- Trackbacks: 0
【ActionScript】XMLに書いてある順番に画像を配置する
- 2010-06-02 (水)
- ActionScript
XMLを読み込んでステージ上に画像を配置するためにこんなコードを書きました。 かなりの割合ではしょってるけども。
for(var i:int = 0; i<xml.@maxnum; i++){ //Panel を用意する panelInit(i);</p> <p>//画像を読み込む img.load(reqImage); img.contentLoaderInfo.addEventListener(Event.COMPLETE, attachImage(i));</p> <p>if(i == xml.@maxnum-1){ Tweener.addCaller(this, { onUpdate : function(){ sortPanel(); loading.visible = false; showControler(); panels.forEach(function(_this:Panel, i:int, ary:Array){ _this.visible = true; _this.oldY = _this.y; _this.y = stageH+_this.height; }); }, onComplete : function(){ panels.forEach(function(_this:Panel, i:int, ary:Array){ Tweener.addTween(_this,{ y : _this.oldY, visible : true, time : 2.5, onComplete : function(){ if(i==ary.length-1){ timer.start(); } } }); }); }, delay : 1, time : 1, count : 1 }); } }</p> <p>function attachImage(_id:int):Function{ return function(event:Event):void{ var img:MovieClip = new MovieClip(); img.addChild(event.target.content); img.x = -img.width/2; img.y = -img.height/2; img.alpha = 1; panels[_id].addChild(img); panels[_id].href = xmlObj.href[_id]; panels[_id].target = xmlObj.target[_id]; panels[_id].addEventListener(MouseEvent.CLICK,clickImg); }; }
panelInit() はPanelクラスを呼び出して配置する関数。 でもこの書き方だと、 Panelを一個配置する→画像を読み込む→読み込まれたらPanelに貼り付ける っていう処理になってるので、どうやら画像が読み込まれた順(?)に配置されてる模様。
これじゃいけないので、 Panelをとりあえず配置する→とりあえず画像を読み込んでおく→順番にPanelに貼り付けていく っていう処理に変えたいと思います。
まず先にPanelを全部配置したいので、
for(var i=0; i<xml.@maxnum; i++){ panelInit(i); }panelInit() だけ別のfor文で処理しておきます。
次に画像を順番に並べてどっかに置いておきたいので、
var imgAry:Array = new Array(); //画像を置いておく配列を用意する for(var i:int = 0; i<xml.@maxnum; i++){</p> <p>//中略</p> <p>//画像が読み込まれたら実行でなく、画像を読み込む準備ができたら実行するようにする img.contentLoaderInfo.addEventListener(Event.INIT, attachImage(i));</p> <p>//中略</p> <p>function attachImage(_id:int):Function{ return function(event:Event):void{ var img:MovieClip = new MovieClip(); img.addChild(event.target.content); img.x = -img.width/2; img.y = -img.height/2; img.alpha = 1; //Panelに設定していた諸々はここではやらないようにする //ただただ画像をおいとくだけにする imgAry.push(img); }; }
で、最後にパネルの配列と画像の配列を対応させます。
//略 if(i == xml.@maxnum-1){ Tweener.addCaller(this, { onUpdate : function(){ sortPanel(); loading.visible = false; showControler(); panels.forEach(function(_this:Panel, i:int, ary:Array){ //ここで各Panelにプロパティを指定する _this.href = xmlObj.href[i]; _this.target = xmlObj.target[i]; _this.addEventListener(MouseEvent.CLICK,clickImg); _this.visible = true; _this.oldY = _this.y; _this.y = stageH+_this.height; //いろいろやったら最後にPanelに画像を貼り付ける _this.addChild(imgAry[i]); }); }, //略
こんな感じで無事XMLに書いた順番に配置してくれるようになりました。
でももっとうまくやる方法がある気がするんだぜ。
- Comments: 0
- Trackbacks: 0
【JavaScript】Twitterの名前部分をGoogleFontAPIで洒落たフォントにするブックマークレット
- 2010-05-20 (木)
- JavaScript | jQuery
追記 Hatena::Letに投稿してみました。
http://let.hatelabo.jp/cancer6/let/gYC-ypbCp6mDIQ
Google Font API なるものが公開されていたのでちょっと遊んでみた。 下記の一文を”Twitterのページを開いている状態”でロケーションバーにはりつけてエンターキーどーん。
javascript:(function(s){s.src="http://unolabo.boo.jp/misc/googleapi/google_fonts.js";document.body.appendChild(s)})(document.createElement('script'));
JSについては下記。
- Comments: 4
- Trackbacks: 0
【XAMPP】XAMPPでSSIを拡張子.htmlでも有効にする
- 2010-05-10 (月)
- apache(XAMPP)
参考:http://dev-man.seesaa.net/article/56353764.html
httpd.conf内 最下部 バーチャルホスト追加部分
<VirtualHost *:9999> DocumentRoot D:/studies/ <Directory "D:/studies/"> Options Indexes FollowSymLinks MultiViews Includes ExecCGI AddType text/html .shtml AddHandler server-parsed .html ←ここを追加 AddHandler server-parsed .shtml AddHandler cgi-script .cgi .pl AllowOverride All Order allow,deny Allow from all </Directory> </VirtualHost>
とのこと。めもめも。
- Comments: 0
- Trackbacks: 0
【Ruby】Rubyはじめました
- 2010-04-09 (金)
- Ruby
Rubyはじめました。 これがなかなかむずかしい…。
とりあえずソースはりつけてみる。
numに指定した数字で”あ~ん”までの平仮名を返すRuby ■ ex.) num=1 #=> あ num=2 #=> い num=51 #=> ん
</p> <h1>!/usr/local/bin/ruby -K</h1> <p>$KCODE = "Shift-JIS" print "Content-Type: text/html\n\n"</p> <p>require 'stringio' require 'jcode'</p> <h1>開始</h1> <p>begin</p> <p>num = 1</p> <p>def call_aiueo(num=0) mbStr = "あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもなにぬねのやゆよらりるれろわをん" mbArys = mbStr.split(//) if num != -1 && num < 52 then print String(num) + ' 番目の文字は ' + mbArys[num-1] + 'です' else print '数が正しくありません' end end</p> <p>call_aiueo(num)</p> <h1>以下エラー表示用</h1> <p>rescue Exception => e print "<html><head></head><body>" print "<br />" print "*** ERROR ***<br />" print "error : " print e print "<br /> backtrace: " print e.backtrace print "</body></html>" end</p> <h1>終了</h1> <p>exit
- Comments: 0
- Trackbacks: 0
【JavaScript】IE6のwindow.parent
- 2010-03-19 (金)
- JavaScript
—————-【追記(2010/03/26 19:07)】—————- 下記の方法でやっていたところ、再度エラーが出る(例によって表示はされないけど)ので、 結局 window.parent.fn() で取りました。
エラーがでたりでなかったりなんなんだよもう。。
昨日のiframeの続きで、 iframe の中の子ページから親の関数を呼び出したかったので、 とりあえず window.parent.fn() で取ってみました。
すると、IE6で動かない。 きっとスコープ的な何かがおかしいんだろうなぁと思い、 window.parent.document.fn() とか色々試しつつ調べつつ。 そうこうしているうちにこんな記事を発見。
parent – hoshikuzu | star_dust の書斎
これによると、IEの場合 document.parentWindow なるものが存在するらしい。
へーなんかきもい。
それでもとりあえず6以外ではちゃんと動いてたので、6だけに適用。なんか怖いし。 document.parentWindow.fn() で無事取得できました。
こんな感じ
if(undefined !== window.ActiveXObject && $.browser.version.indexOf('6.') != -1){ document.parentWindow.fn(); }else{ window.parent.fn(); }
- Comments: 0
- Trackbacks: 0
Home > Tags > Webに関すること
- Search
- Feeds
- Meta