Posts Tagged ‘WEBサイト’

text-size

火曜日, 3月 30th, 2010

テキストサイズをボタンをポチポチ押して

大きくしたり小さくしたりするスクリプトを

勉強がてら作ってみる

jQueryを使用しているので、リンクを貼っていること前提です

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
    var count = 2 ;
    var textsize=["0.8em","0.9em","1em","1.2em","1.4em"] ;
    $('#big').click(function(){
        count++:
        $('サイズ変更したい要素やid,class名').css("font-size",textsize[count]);
        if(count>4){
        count=4;
        }
    });
    $('#small').click(function(){
        count--:
        $('サイズ変更したい要素やid,class名').css("font-size",textsize[count]);
        if(count<0){
        count=0;
        }
    });
});
// ]]></script>

#bigやら#smallやらは任意のアンカーにつけてくだされ

1
2
<a id="big" href="#">文字を大きくするよ</a>
<a id="small" href="#">文字を小さくするよ</a>

みたいに。

で、変数countに「2」を最初に入れているのは、ブラウザ読み込み時のデフォ

文字サイズはtextsizeに配列でぶちこんでいるので、その場所(=1em)を指定しています

クリックでcountの数値を増やしたり減らしたりして、配列から文字サイズを変えています

if文は、やたらめったにクリックされると「count=100」とかになってしまうと、文字サイズを小さく変更するまで大変!

ということで、countの数値を配列数に収めてます(0~4の間っすね)

ラクチンポン

ちなみに、WORDPRESSやらでは「$」を使用するとうまく動作しないことがしばしばあるので、

私は「$」ではなく「jQuery」を使うようにしてます。

1
jQuery(document).ready(function(){

と。

BOLTS HARDWARE STORE

火曜日, 3月 9th, 2010

はい、制作しました。

BOLTS HARDWARE STORE

京都の金物屋さんです。

金物って何?と思われる方もいらっしゃるでしょうけど、

僕がどうのこうの言うよりも、まずは行って見て下さい。

サイト上には店主の思いがつまっています。

言葉足らずなところも多々ありますが、ちょっとでも興味を持ってもらい、

着地としては、「金物」という1つの概念的なものを分かってもらいたい。

もちろん「売れる」ってことは必要ですが、

店主の「金物をもっと知って欲しい」という気持ちの強い方です。

元々、Pacific Furniture Serviceで販売から設計まで多岐に活躍されていた方なので、

金物以外でも内装やらインテリアやらのことも詳しい。

きさく。

是非、京都に行く際、立ち寄ってみたい場所の1つにしてもらえると嬉しいです。

bolts hardware store

jQueryで高さの調整

金曜日, 3月 5th, 2010

コンテンツ量が少なく、footerが上にきてしまっている

というときjQueryを使ってきちんと下部に表示するようなスクリプトを書いてみた。

htmlはdiv#header、div#main、div#footerという構成を前提にします。

これら3つの高さがウィンドウサイズより小さかった時に、#mainの大きさを指定するっていうこと。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type="text/javascript">
jQuery(document).ready(function(){
  var winHeight = jQuery(window).height();
  var headHeight = jQuery('#header').height();
  var mainHeight = jQuery('#main').height();
  var footHeight = jQuery('#footer').height();
 
  var fullHeight=mainHeight+headHeight+footHeight;
 
  if (fullHeight <= winHeight) {
   var wrapHeight = winHeight-headHeight-footHeight;
   jQuery(function() {
    jQuery('#main').height(wrapHeight);
   });
  }
});
</script>

うむ。

どうして「$」じゃないかって?

それは、「エラーになった」からです。

コンフリクトっていうんでしょうか。

他のプラグインではいけてるっぽいんですが。

でも、まー、うまくいってるから良しとします。

1つの手段として、有効であれば・・・

timestamp

日曜日, 2月 14th, 2010

自サイトの整理とかしていて、新しくしようとしていて、

作ったサイトとかブログとかツイッターとか、全部1つのページにしちゃおうと、

このブログと同じグリッドで行こうと、何やかんやしていて、形にはなった。

ほんで、twitterの「about….ago」をつけたいなぁ、と思いつけてみる。

PEARのXML_RSSを使用(ってかこれしか使えない)。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
//TWITTERの呟きを取得
$tweet_url="(RSSのURL)";
$tweet=&new XML_RSS($tweet_url);
$tweet->parse();

foreach($tweet->getItems() as $key=>$item02){

    //つぶやきからどれくらいの時間が経ったのか表示する
    $past=$item02['pubdate'];
    $past=time()-strtotime($past);
    if($past<60){
        $item02['pubdate']="about 1 minite ago";
    }else if($past<3600){
        $item02['pubdate']="about ".round($past/60) ." minites ago";
    }else if($past<7200){
        $item02['pubdate']="about 1 hour ago";
    }else if($past<86400){
        $item02['pubdate']="about ".round($past/3600) ." hours ago";
    }else if($past<172800){
        $item02['pubdate']="about 1 day ago";
    }else{
        $item02['pubdate']="about ".round($past/86400)."days ago";
    }
}

タイムスタンプを力技で「分」「時間」「日」にするっていう。

もっとスマートなやり方があるんだろうけど、まだわからないし、表示が出来たっていう達成感。

私のサイトで確認してみて下さい

twitterでは「half a minute」とか「less than a minute」とかあるけど省略。

必要ないですからね。

IEってやつに・・・

火曜日, 2月 9th, 2010

久しぶりにIEでブログを見たら、

ありえんことになっていた。

「jQueyの引数が無効です」

??

検索するも、有効な手立ては見つからず。

で、現状をローカルにダウンロードし、テンプレートを入れなおしてみて、

一寸ずつ戻していってみる。

header,footer,index,sidebar,function…

でcss

うん、cssだ。

ではどこだ?

text-shadowか?border-radiusか?

とやっていると・・・

div.grid-itemとdiv.single-itemを元々一緒の記述だったのを2つにわけ、

gridにはボーダーなし、singleにはボーダーありで設定していた。

おそらく、そこ。

ってか、ここ。

解決したけど、えらい時間を食ってしまった。

もう少し、がんばろう。

xml_rss

土曜日, 2月 6th, 2010

自分のブログの記事を、まぁどこぞに出力するものを書いてみようということで、pearのXML_RSSをどどーんと使ってみる。

まずはレンタルサーバーにXML_RSSが入っているか、phpinfo()で調べてみると、まぁ入ってない。

なおかつ、プラグインをアップすることさえ出来ない(っぽい)

漁ってみると、「PEARのディレクトリ作って、.htaccessでパスをとおしてやる」ことにたどりつく。ありがとうございます。

ftpで好きなディレクトリ(パスがとおるところね)にPEARディレクトリを作るか、ローカルからそのままぶち込む

.htaccessで

1
2
3
<IfModule mod_php5.c>
php_value include_path ".;/(フルパス)/PEAR"
</IfModule>

で好きなプラグインをぶち込む。

1
2
3
4
5
6
7
8
9
10
<?php
require_once("XML/RSS.php");
$blog=&new XML_RSS("http://www.takasumi-nagai.com/blog/feed/rss2");
$blog->parse();
foreach($blog->getItems() as $item){
$time_s=strtotime($item['pubdate']);
$time=date(Y年m月d日,$time_s);
echo "<p>".$time." <a href=\"".$item['link']."\">".$item['title']."</a><br/>".$item['description']."</p>";
}
?>

でpostした日時・タイトル・リンク・ディスクリプションを。

twitterのRSSでも使えるんだろうな。

忘れないようにしようっと。

<?php
require_once(“XML/RSS.php”);
$blog=&new XML_RSS(“http://www.takasumi-nagai.com/blog/feed/rss2″);
$blog->parse();
foreach($blog->getItems() as $item){
$time_s=strtotime($item['pubdate']);
$time=date(Y年m月d日,$time_s);
echo “<p>”.$time.” <a href=\”".$item['link'].”\”>”.$item['title'].”</a><br/>”.$item['description'].”</p>”;
}
?>

wp-theme(2)

木曜日, 1月 28th, 2010

またもやテーマを変えてみましたよ。

TRIPLESHIPS.Incさんのテンプレート”tanzaku

流行のやつです。

CSS3の角丸も実装してます。

IEの方にはわからんかもしれませんが、firefox,chrome,safariなら見える。

このテーマを入れた時、きちんとグリッドも何もうまく働いてなかった・・・

色々調べてみたら、lightbox2のプラグインと相性が良くなかったようです。

vgridのjsに悪さをしていて、機能してませんでしたよ。

ばっさりと、このプラグインを、切りました。

同じようなものを、また探して、いれたいと思います。

ただ、このテーマにして、すごい、読み込みが遅くなった・・・アクセシビリティー。

sincethen

火曜日, 1月 19th, 2010

あれから、どのくらい経ったのか・・・

を「見る」スクリプトです。

trick7というブログの作者さんが作った、とてもユニークなブログパーツ。

さて、何を計ろう・・・

ちなみに、このパーツがはられているところ(自分だろうが他人のブログだろうが・・・)

クリックしてからの経過時間が見れるそうですよ。

うーむ。面白い。

チーム マイナス6%

日曜日, 12月 6th, 2009

主観でしかありません

本当に、自分が、ふと思ったことでしかありません

結構たくさんの企業が、このバナーをつけていて、

申請して(企業は登記簿とかいるみたい)、認証されて、会員(チーム?)になって、

さて、どうするのだろうか。

低炭素社会、CO2削減、エコ・・・

良いことだと思いますし、もちろん、環境とかそんなことを本気で考え行動することが素晴らしいことです

・・・

このチームマイナス6%っていうバナーを企業や個人のサイトに貼り付けてあるのを見て、

正直、若干のうんざりを覚える

というもの、実際「何をやってんだ」ってこと

参加する=エコアピール

みないな

社員は車も電車も使わず徒歩や自転車で通勤している、とか

夏も冬もエアコンは使わない、とか

トイレの汚物はすべて畑の肥料にしている、とか

そんなことではなく、ただのアピール

もっと悪く考えると

ただ単純に「1つの有効な外部リンクを取得するため」ってなると、

チームマイナス6%が、利用されているだけやん、と思ってしまう

ゲンナリします

それが言いたかった

UNIQLO

日曜日, 3月 8th, 2009

こないだ、UNIQLOでジーンズを買った

ジーンズを買うこと自体、3年ブリだし、まさかUNIQLOで買うとも思わなかった

何故か

自分はオシャレでもなんでもないんですが、

昔のもっさりとしたイメージを払拭できずにいた、自分の中でのお話

でも買った

試着してみると、これが、まぁ、良かったんですね

柳井さんは、昨年より資産が10億円ほど増えたらしい

百貨店は、UNIQLOを誘致し出している

そして、UNIQLOのサイトが、何か始めるとニュースになる

TOKYO FASHION MAP

ブログパーツも大好評だったみたいですね、あのユニクロック

ブランディングが上手なんでしょう、上手です

見せ方とか

あー、まんまとやられています