パネルやボタン、タブ、メニューなどのUIエレメントの美しいスタイルをはじめ、ホバー時のエフェクト、レイアウトなど、CSS3を使ったスタイルシートのテクニックを紹介します。 ※CSS3を使っているため、対応ブラウザはIEでは9くらいのものが多いです。7対応もあります。
スタイルシートのmarginで使用する「ネガティブマージン(マイナスマージン)」について理解しておくべきこと、ネガティブマージンを使用したテクニックなどをSmashing Magazineから紹介します。 The Definitive Guide to Using Negative Margins 1. ネガティブマージンの理解 2. ネガティブマージンの使い方 3. ネガティブマージンのテクニック集 4. ネガティブマージンのバグフィックス 5. 終わりに 1. ネガティブマージンの理解 スタイルシートを使用する際、必ずといっていいほどマージンを使用するでしょう。しかし、ネガティブマージンになると意見は分かれ、それは悪魔の仕事であると考える人たちもいます。 ネガティブマージンをは、例えばこういうのです。
JavaScriptを勉強しているとオブジェクトとはなんぞや?ということがわからなくなってきます。選択肢が増えれば増えるほど。 JavaScriptには、同じように見えて、実は同じではないデータがあります。それらのオブジェクトについて、区別して説明が付けられるように、自分なりに考察してみました。勉強中のアウトプットなので、ここで書いた内容は事実とは大きく外れているものかもしれません。とにかく不明瞭な部分を自分なりに理由づけしたかっただけです。 サンプルコードを試される場合は、FirefoxのFireBugにあるコンソールに貼りつけて実行するか、Safariの開発ツールにあるコンソールに貼りつけて実行してください。それがわからない方は console.log の部分を alert に置き換えて確認してください。 話がややこしくなるので、今回はプロパティしか扱っていません。 名称の定義について
The Photoshop Roadmapのエントリー「40+のスペシャルなエフェクトを与えるPhotoshopのアクション」から、面白そうなPhotoshopのアクションをいくつか紹介します。 40+ Special Effects Photoshop Actions
テキストにメタル・光沢・グランジ・立体化などのエフェクトを使用したPhotoshopのチュートリアルの紹介です。 各サイトは英語ですが、キャプチャ付きで作成方法を説明しています。 一部のサイトでは、PSDファイルをダウンロードできます。
はじめに 初心者向けページなのでムービーメーカーについても触れてあります、 必要の無い人は「ムービーメーカーで高画質化」以外を読んでください。 作成例として、1280x720のグランツーリスモのPVを加工しアップロードするまでの工程を書いてあります。素材の画像や映像によって変わる部分もあるので気をつけて INDEX 用意するもの ムービーメーカーで高画質保存 x264詰め合わせのインストール aviutlの前準備 aviutlを使ってH.264で出力 Q&Aとか右側にあります→ ▼出来上がりサンプル http://www.nicovideo.jp/watch/sm2530675 512X288 H264-680kbps AAC-96Kbps 2-Pass 高画質動画の為に必要なもの 用意するもの ●Windows Media Player 10以上 → 高画質のwmvを作る時
このネタは、らばQの以下のネタに対する「Operaユーザーからの回答」だが、タイトルに偽りがある。こんなもんで「テクニック」とか言ったら、いい笑い者になるだろう。 日本語でも使える!? Googleでこんなこともできちゃう検索テクニック10:らばQ こんなもんは、Operaなら拡張とかグリモンとか無しで、もっと楽に出来る。 1.ファイルタイプ検索 Googleではファイルの種類を指定して検索することができます。 たとえば、以下のようにします。 PDFだけ検索 filetype:pdf MS-Word文書だけ検索 filetype:doc 一太郎文書だけ検索 filetype:jtd パワーポイント文書だけ検索 filetype:ppt 多分、こんな検索をするヤツは滅多に居ないと思う。でも、もし頻繁に使うなら、一々「filetype:pdf」なんて打ち込むのは面倒だよな? そこでOperaの
Googleドキュメントが強力なアンケートツールに!フォーム機能が新しく追加! 管理人 @ 2月 7日 04:25pm Google ドキュメント Googleドキュメントのスプレッドシート(表計算)に、とても便利な機能が加わりました! 入力フォームを作って、それをメールで誰にでも送ることができるようになりました。 そして、Googleアカウントを持っていないユーザーでも、そのフォームに記入することができます。 アンケートや、スコアシートなど、大勢に協力してもらって、情報収集するのにきっと役に立つツールです。 さっそく簡単なアンケートを作ってみました。↓ http://spreadsheets.google.com/viewform?key=pG2FhOx16a4r4Gm9wIT_7Dw 上のアンケートは選択式ですが、もちろん入力式のものも作れます。 例えば、バードウォッチングサークルで、
この記事で Firebug ハッキング Tips を纏めたい Firebug に一行追記して右クリックで XPath をコピペ出来るようにする。 - IT戦記 とか言ってたけどその前に、 僕は Firebug だけじゃなくて、 だいたいの拡張機能で、簡単に「チョコチョコいじれる化」というのをしてるのでそれを書いてみます。 チョコチョコいじれる化とは jar ファイルを解凍しておいてすぐ書き換えられるようにしとくこと。 「チョコチョコいじれる化」しとくと気付いたときにちょっと JS や XML や CSS を追加するだけで、いろいろ改造できて楽しい。 「でも、 Firefox が壊れる可能性があるじゃん><」って? チッチッチ、ナンセンスだよメーン そんなの拡張機能のディレクトリを削除しちゃえば元通りさ Don't be scared! iKnow!で英語。ちょっとの努力で、大きな成果を。
My experiments with .Net : Combine CSS with JS and make it into a single download! 1つのファイルにJavaScriptとCSSをまとめて記述する方法。 まず、test.jscss というファイルを作って、次のように内容を記述します。 <!-- /* function t(){alert('test');} <!-- */ <!-- body { background-color: Aqua; } そして、次のようにJavaScriptとCSSを呼び出す際に先ほど作成したtest.jscssを指定することができます。 <html> <link type="text/css" rel="stylesheet" href="test.jscss" /> <script type="text/javascript"
書き物してるときなど、集中して作業したいときに使えるアプリのご紹介。全部Mac用です。 基本機能は、使いたいアプリを前面に表示して残りのウィンドウなどは目立たなくさせる(または非表示にする)、というものです。 Think Welcome to Freeverse Software 画面に黒いスクリーンをかぶせて、特定のアプリ以外を目立たなくさせるアプリです。 例えばテキストエディットのみ表示させると上のイメージのようになります。 スクリーンの透明度は自由に変更できるので、バックを完全に真っ暗にすることも可能です。 前面に表示するアプリは↓のIllumination Panelを呼び出して選択します。 Isolator http://willmore.eu/isolator/ Thinkと同様に、アプリ一つを強調表示するアプリです。 ただしIsolatorの場合は、常に選択したアプリのみを表
「素早く起動」「コピー&ペースト」「数式そのまま入力」「円周率を一瞬で表示」「10進数を16進数に変換」――手軽に使えて便利なWindows標準の電卓をもっと便利につかうTipsをご紹介しよう。 Windows標準の電卓は、日ごろから手軽に使えて便利だ。もっと便利に利用するためにいくつかTipsをご紹介しよう。 「電卓」アプリを素早く起動する まずは、わざわざ「スタート」-「プログラム」-「アクセサリ」-「電卓」と選ばなくても素早く電卓を起動できる方法である。[Windows]キーが付いているPCであれば、[Windows]+[R]で「ファイル名を指定して実行」ダイアログを呼び出し、「calc」と入力する。[Windows]キーがないPCの場合は、[Ctrl]+[Esc]でスタートメニューを呼び出し、[R]を押して「ファイル名を指定して実行」ダイアログを呼び出そう。 ショートカットキーボー
まずは最近知って便利だと思ったCSSの小技をひとつ。 文章の最後に、「※(米印)」などで注釈を入れたいときに、CSSのみで行の開始位置を揃えるのにすごくシンプルなやり方がこれ。 .note { padding-left:1em; text-indent:-1em; } <p class=”note”>※米印を使う場合はこいつが便利。<br /> 改行してもこの通り。ちゃんと開始位置が揃ってる。</p> 「padding-left : 1em;」でまず1文字分右に動かして、「text-indent : -1em;」で最初の行だけ1文字分左に出す、ということらしいです。これ考えた人はえらいっすねぇ。 他には開始位置を揃えるいわゆる「ぶら下げ」をCSSでやる場合、<div>タグの入れ子を使ってもいいが、<dl><dt><dd>の定義型リストを使うのがおすすめ。Definition Listの略で
Movable Type に表示する dTree カテゴリーリストに、ブログ記事数を表示するカスタマイズです。このカスタマイズを行なえば、d... [記事ページへ]
当サイトで公開しているカレンダーのカスタマイズは、日曜と祝日に同じスタイル(厳密には同一のクラス属性値)を割り当てていますが、「日曜日と祝日のスタイルを分けるにはどうすれば良いでしょうか」というご質問を頂きましたので、本エントリーにてクラス属性を個別に割り当てる方法をご紹介致します。 ここでは Movable Type の「Ajax 月送りカレンダー」を例に説明していますが、他のブログのカレンダーカスタマイズでも同じような変更を行えば大丈夫だと思います。 1.dayChecker.js の修正 任意のエディタで dayChecker.js を開き、下記の赤色部分を削除します。 function isHoliday(year, month, day) { var week = new Date(year, month - 1, day).getDay(); if (week == 0) {
「Ajax 月送りカレンダー」の縦型版のカスタマイズを紹介します。下のスクリーンショットは完成例です。 これまでに Movable Type の月送り縦型カレンダーを iframe を用いてカスタマイズを試みたのですが、クロスブラウザ問題、つまりブラウザによって表示の崩れが発生し、これを解消できないため、当サイトでは公開を見送ってました。 が、Ajax 版では iframe が不要になり、上記のような表示が可能になります。 以下に簡単なサンプルを作りましたので動作をお試しください。 Ajax 月送りカレンダー(縦型)サンプル 仕様 ここで紹介する月送りカレンダー(縦型)の主な仕様です。 Ajax を利用して縦型カレンダーを月送りにします。Ajax 化されるのはページ表示時および月送り時のカレンダー取得です クッキーを利用して月送り状態を保持します カレンダーの取得に失敗した場合、カレンダー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く