タグ

ブックマーク / bashalog.c-brains.jp (6)

  • Google Map を簡単お洒落にカスタマイズ!「Styled Map Wizard」使ってみた。 | バシャログ。

    今月発売予定の「メタルギアライジング」をそわそわ楽しみにしているアクションゲー好き seki です。 今回もWebサービスのご紹介です! 最近よくよく見かける、「Google map」のデザインをお洒落にカスタマイズして載せているサイト。皆さんも一度は目にしたことがあるかと思いますが、こちら、どうやって作っているか気になりますよね。 今回は、js無知な私でも簡単に作れる Google Maps API 「Styled Map Wizard」の使い方を、ざっくりと例を挙げてご紹介します。 【参考サイト】 今回はこちらの記事より、参考・引用して解説します。こちら、とても丁寧に解説されているので、jsが分らなくても出来るかと。 今回作成したもの 画像ですみませんがこちら。 アイコンは seki になっていますが場所はバシャログ。陣です。 色をモノクロにして、交差点やコンビニ、銀行などのアイコン

    Google Map を簡単お洒落にカスタマイズ!「Styled Map Wizard」使ってみた。 | バシャログ。
  • 【CSS】実はこんなに便利!cssのセレクタ指定方法をちょっとだけ掘り起こしてみた | バシャログ。

    モニターを見つめる目に優しいメガネがZoffからも出る!しかも度付きOK、フレームも選べる!気になってます。hakoishiです。 さて、今回は実は便利なcssのセレクタ指定方法をちょっとだけ掘り起こしてご紹介。 直下にある要素だけ、とかセレクタ名が部分一致したら、はたまたリンク先パスによって、とか実はかなり便利です! 特定の要素の直下の要素だけに一括でマージンを設定 特定の文言を含むセレクタ、及びその位置で対象を絞り込み指定 リンク先のパス次第でスタイルを切り分ける 特定の要素・セレクタを例外とする 特定の要素の直下の要素だけに一括でマージンを設定 #container>* { margin: 0 10px; } IE7以上対応。 親>子で、直下要素のみを対象指定。 上記例ではid="container"の直下の要素すべてにマージンが設定されます。 ユニバーサルセレクタには正直不安を感じ

    【CSS】実はこんなに便利!cssのセレクタ指定方法をちょっとだけ掘り起こしてみた | バシャログ。
  • Webデザインのツール、FireworksとPhotoshopは何が違うの?を考えてみた | バシャログ。

    はじめましてバシャログメンバーにデザイナーとして 10月末から加わりましたkojimaです。 わたくし、こちらに所属して先日初めてFireworksCS5触りました! CS3をちょいちょいお直しレベルでしか触ったことなかったので 新鮮!!を通り越してさっぱりわからん! というわけでFireworksとPhotoshopどこがどう違うの?から考えてみました。 PhotoshopでWebデザイン もともとPhotoshopは名前の通り写真屋さん、写真/画像編集ツール。 その繊細な描画力が仇となり、Webのデザインをしようと思うと シェイプが滲みが気になったり、レイヤーが200枚を越えたり。 でもやっぱ絶妙な質感再現しちゃう画像処理すんばらしい! FireworksでWebデザイン もともとMacromediaがWebデザインツールとして開発。 共通パーツ作る時に大助かりなシンボル化機能 1ファ

    Webデザインのツール、FireworksとPhotoshopは何が違うの?を考えてみた | バシャログ。
  • Dreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能5つ | バシャログ。

    チーム内のももクロ旋風が留まるところを知りません。 まだメンバーの顔と名前覚えきってないんだけどそんなこと言えないhakoishiです。がんばります。 さて、日はDreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能を5つほどご紹介します。 Zen Coding これはもう、いわずもがなですね。コーディング効率大幅アップ。 下記よりDreamweaver用のファイルを選択してDLしてください。 Downloads - zen-coding 閉じタグコメントを挿入 「コマンド」メニュー⇒「閉じタグコメントを挿入」で閉じタグコメントを自動で挿入してくれます。 ID・classも自動的に拾ってくれるので、構造のチェックにも便利。 コメントを生成して挿入するDreamweaver用の拡張機能を作成しました Dreamweaver CS5 Validator 「結果」パネル⇒「バ

    Dreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能5つ | バシャログ。
  • 【Fireworks】144種類のテクスチャがセットになった拡張機能 「Texture Collection」 | バシャログ。

    こんばんは、最近「ももいろクローバーZ」にハマってしまいましたishidaです。 先月発売された1stアルバムを買うか否か迷ってます。 今週末土曜日に、読売ランドでライブもあるんだよなぁ~。 さてさて、今回はちょろっとFireworksの拡張機能のご紹介です。 拡張機能にもいろいろありますが、 汎用的に使えそうな144種類がセットになった拡張機能です。 mxp形式で配布されているので、 インストールするとFireworksプロパティパネルの[テクスチャ]にドーンと表示されるようになり簡単に使えます。 テクスチャ画像を配布しているサイトはよくありますが、拡張機能として配布しているのは珍しいですね。 配布元サイト Texture Collection 144 - Fireworks Zone

    【Fireworks】144種類のテクスチャがセットになった拡張機能 「Texture Collection」 | バシャログ。
  • Facebook のソーシャルプラグインを導入しよう | バシャログ。

    久々に揺れた!(8/17 9:25 頃) 現在進行形の話題を出してライブ感を醸し出してみました。kimoto です。 日はいろんなサイトで最近よく見かけるであろう Facebook のソーシャルプラグインをいくつかご紹介します。 ハッキリ言ってこのソーシャルプラグイン、解説するまでもなくむちゃくちゃ簡単です。 こんな簡単なの、なにドヤ顔で記事にしてんの?って思われる方もいらっしゃるかもしれませんが、そこはご容赦くださいませ。 Facebook のソーシャルプラグインのページはこちら。 2012/1/19 追記 その 2 を書きました。よければこちらもどうぞ。 Like Button まずはFacebook の代名詞とも言える、「いいね!ボタン」です。 基的にはそのページの URL を指定して、「このページ、このくらいいいね!って言われてますよ!あなたもどうぞ!」っていうのを閲覧者見せる

    Facebook のソーシャルプラグインを導入しよう | バシャログ。
  • 1