Skip to content

背景を透明にしたときに軽くする

ウエブサイトをデザインしているときに背景や、ほかのコンテンツを透明にした方がかっこいいかなと思ってとりあえずcssのopacity機能を使って背景の色を透明にしてみました。

 

コードはこんな感じです。

 

#sample{

background-color:#ffffff;

opacity:0.7;  /*透明度を0.7に指定*/

/*もしくは*/

background-color:rgba(255,255,255,0.7);  /*前3つの数字で色を指定し、4つ目の数字で透明度を指定*/

}

 

これでsample要素の背景に透明度0.7の白い色が塗られました。

 

ブラウザで確認してみたところ、大きな画像やいくつかの無駄なコードも多かったので少し動きが重くて遅くなっていると感じたので、とりあえず原因を調べてみたところ、どうやら背景の色をcssで透明に指定することも重くなる原因の一つのよう。

 

これを解決するには背景の色cssで指定して透明化するのではなく、事前に透明の画像を作って背景に埋め込んでしまうのが良いらしい。

 

同じ一色の画像なので1px×1pxの最小サイズで透明の白い画像を作り、背景一面に貼付けてみました。

 

少しは軽くなったかな。。。

広告

Google Maps

初めてウエブサイトにグーグルに地図を思ったので早速グーグルマップについて調べてみた。

そしたらなんと今ではV3という新しいバージョンがリリースされており、チュートリアルを読んだら指定されたプログラムをHTMLスクリプトのなかに埋め込むだけで簡単にできるっぽいぞ!!

 

早速やってみたら。。。でねえー

なーんでだー

 

チュートリアルで書いたあるこれを丸ごと写せばmapが出ますよっていう所をそれなりに注意してあらかじめ自分が作りかけていたページに埋め込んであっさりマップが見れるはずだったのに。。。

 

いろいろ調べてみたところ、どうやらマップを表示する部分の枠の大きさを指定する”width”と”height”が初期設定では100%になっているのだが、これをしっかり指定してあがれば問題が解決するということがわかった。

適当にwidth:100px;height:100pxで試しにやってみたら。。。

 

 

マップがでた!

 

ということで問題解決!

 

PEARインストール

ターミナルを開く

コマンド:curl http://pear.php.net/go-pear> go-pear.php

コマンド:sudo php -q go-pear.php

途中いくつか選択して選ぶものがあるがとりあえずEnterを押して進行

パスを作製する

コマンド:PATH=$PATH:(ファイルのある場所)

コマンド:pear list

で確認してInstalled packagesが確認できればOK

MAMPをターミナルで使うための流れ

とりあえずMAMPを起動

次にターミナルを起動する

まずはMAMPのbinに移動する

コマンド:cd /Applications/MAMP/Library/bin

mysqlにアクセスする

コマンド:./mysql -u root -p

Enter password:

でパスワードを入力してログインする

パスワードを忘れてもMAMPのSTART画面で確認できます。

 

データベース一覧の表示

mysql> show databases;

 

データベースの変更

mysql> use database;

ワードプレス

新しく始めました。

 

とりあえず投稿