Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
2015年3月18日 CSS 2011年に「少しのコードで実装可能な20のjQuery小技集」という記事で数々の便利な制作技を紹介したのですが、時は流れ、今ではCSSのみで表現できるものが多くなってきました。という事で今回はその記事内で紹介した技を中心に、かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる小技を紹介します。 ↑私が10年以上利用している会計ソフト! 目次 Div全体をクリックできるようにする テーブルの偶数・奇数の行の色を変える フォームにテキストを入れておき、フォーカスで消す(文字色も変更) ラジオボタンとチェックボックスを装飾する スライドパネル アコーディオン ツールチップ 言語によってスタイルを変更 横並びのdivの高さ揃える ボックスを上下左右中央に配置する それでは実際にどんな事ができるのか見てみましょう!サンプルも作ったのでコードと
By Global Panorama 「検索エンジンといえばGoogle」と言えるほど世界中で使われているGoogle検索は、ブロック崩しができるなど隠れたキーワードや機能がコッソリ追加されていることでも知られています。そんなGoogle検索で知っていると便利な工夫や、ちょっとしたキーワードの追加で超絶便利にしてくれる35機能がDigital Trendsでまとめられており、その中から27の機能が日本語でも使えることが確認できました。 The 35 Best Google Search Tips and Tricks | Digital Trends http://www.digitaltrends.com/computing/the-35-best-google-search-tips-and-tricks/ 検索での句読点、記号、演算子 - ウェブ検索 ヘルプ https://supp
無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする >> ありがちなリスト記事タイトルですが、筆者がコンバージョン最適化のプロだけに、様々な法則を元にウェブデザインの効果的な手法を説いたユニークなアプローチかつ有益な内容の記事です。 — SEO Japan ウェブサイトのデザインは、コンバージョンにとって、思っている以上に重要である。世界中のありとあらゆるコンバージョンを改善する手法を実行することは可能だが、サイトのデザインが劣悪なら、大した効果は期待できない。 デザインには、デザイナーではなくても対応することが可能だ。デザインはマーケティングでもある。デザインは製品であり、製品のメカニズムでもある。デザインのことを学べば学ぶほど、結果は良くなる一方だ
2016年6月9日 Webデザイン レストラン、居酒屋、カフェ、バーなどなど、国内だけでも数えきれないほどの飲食店が存在します。そのため、飲食店のWebサイト制作を経験したことのある、またはこれから制作予定のデザイナーさんも多いのではないでしょうか?そこで今回は特にレストランにスポットをあてて、必要な要素や制作ポイントを考えてみようと思います。 ↑私が10年以上利用している会計ソフト! おいしそうな写真が命! ユーザーがお店に入る前にチェックしておきたいのは、そのお店でどんな体験ができるのか?という事。どんな料理が出てくるんだろう?一皿頼んだらどれくらいの量なんだろう?お店の雰囲気は?などなど…。これらの不安を解消してくれるのがクオリティの高い写真です。最近ではファーストビューで画面いっぱいの写真を背景画像としてドドーンと表示しているサイトもよく見かけますね。 鉄板焼きの可らしでは写真では
node.jsをインストール node.jsは、イベントループとノンブロッキングI/Oを特徴として持っているサーバサイドJavaScriptの仕組みです。gitから最新のビルドをダウンロードして使うことが出来ます。早速使ってみましょう。まずは必要なライブラリをyumからインストールします。 $ sudo yum install git -y $ sudo yum install openssl-devel -y $ sudo yum install gcc-c++ -y $ sudo yum install make -y 次に複数のnodeを使えるようにnvm(Node Version Manager)をgitからダウンロードします。 $ git clone git://github.com/creationix/nvm.git .nvm $ . .nvm/nvm.sh nodeのインス
こんにちは。良昌です。 Facebook、GithubなどのJSON形式でユーザ情報を返却するAPIや、PhoneGap、Monacaなどのスマートフォンのマルチプラットフォームを提供するライブラリ、IDEが開発ツールとして定着してきたことにより、JavaScriptを利用する機会が増えたのではないでしょうか。 今回は、JavaScriptコンテナがWebブラウザの場合に、動的に確保されるメモリ領域の浪費を避ける方法について書きたいと思います。 JavaScriptにおけるメモリの浪費を避けるコーディング JavaScriptにおけるメモリの浪費を避けるコーディングをするためには、GC(ガベージコレクション)、クロージャについての知識が必要です。まずは、この2つの機能について説明していきます。 ■GC(ガベージコレクション) GCとはプログラムが動的に確保したメモリ領域の内、不要になった領
先日、久しぶりに新しいGoogleアカウントが必要になって、新たに登録したところ、随分色々な個人情報の登録が必要になっていた。確か昔はID・パスワードと予備のメールアドレスぐらいだったと思うのだが、現在は以下のとおり、氏名と性別、生年月日に加え、電話番号の入力欄まである。オプション的な項目かと思って空欄にすると先に進めないので、基本的に全部入れないとアカウントが取得できないようだ。(電話番号とメールアドレスはどちらか片方でよい。) アカウント登録用の入力フォーム。画像が切れてしまっているが、さらに下にはCAPTCHAの入力欄などもある。 Google アカウントの作成 どうしてこんなに個人情報の入力が必要になったのかと思って、登録作業を進めてみたら、理由が判明。記事のタイトルにも書いたように、今のGoogleアカウントは、登録が完了すると強制的にGoogleプラスの利用が始まるからだ。Go
Webサイトを高速化をすることによって得られるメリットは様々です。ユーザーエクスペリエンスの改善といった話とは別に、サーバーの台数を減らせることも大きなメリットでしょう。 サーバーの台数が減ればコストも下がるし、運用も楽になりますので、Webサイトの高速化はSEO対策に限定せずに実現したいところです。 しかし、「高速化しよう」「表示速度を改善しよう」といっても、実際に高速化を阻害するような要因を知っていなければ、どう取り組んで良いか分かるはずもありません。 今回の記事では非エンジニアの方でもサイト高速化のポイントがある程度理解できるように、大まかに要点をまとめています。 \ナイルがリードを増やした秘密を公開/ 高速化のための基礎知識 高速化という言葉の中には、大きく分けて2種類の概念が存在します。 フロントエンド側での高速化 サーバーサイド(バックエンド)側での高速化 フロントエンドとは
最新文章 2018-12-26 14:57▪ 宝山一楼盘千余业主收到高额交房通知书 2018-12-26 14:57▪ 书写大国经济的崭新篇章 2018-12-26 14:57▪ 杨浦3条公交线路拟调整居民以后出行方便了 2018-12-26 14:57▪ 上海交通行为样板路段区域12月测评榜公布 2018-12-26 14:57▪ 涉及30万人,葛洲坝集团宜昌基地六大类职能分离移交宜昌 2018-12-26 14:57▪ 金正恩送韩国的丰山犬生6个宝宝青瓦台晒近照 2018-12-26 14:57▪ 新华网启动视频化战略加速构建内容新生态战略支点 2018-12-26 14:57▪ 又一煤矿被重罚今年云南已查处53起煤矿严重违法违规典型... 2018-12-26 14:57▪ 央行:四季度88.8%的居民认为收入增加或基本不变 2018-12-26 14:57▪ 回首2018重温习近平
初心者向けの本とかだと、イベントを jQuery オブジェクトの後に直接指定する、 $('.foo').click(); のような書き方で説明されている場合が多いけど、少し複雑なことをしようとするとそれだと困ることが出てきます。そんなときに便利なのが on() を使ったイベント設定です。 on() ひとつで bind() live() delegate() を表せる jQuery 1.7 で、bind() live() delegate() がすべて on() に統合されたそうです。 つまり on() の書き方によって、3 パターンの使い方ができるということです。 .foo という要素をクリックしたら何かするという例で、イベントの設定と削除の方法をそれぞれ書いてみます。 bind() $('.foo').bind('click', function(){...}); は $('.foo')
AWSWordpress April 5th 2016 Amazon EC2でWordPress – Amazon S3にメディア画像等の静的ファイルを設置する方法 AWSWordpress April 5th 2016 Amazon EC2でWordPress – パーマリンクがうまく動作しない場合 AWSWordpress April 5th 2016 Amazon EC2でWordPress – SSH接続からWordPressのインストールまで AWSWordpress April 4th 2016 AWS Amazon EC2上でWordPressを動作させる方法 – EC2のインスタンス作成からMySQLの設定まで AfterEffects May 25th 2015 After Effects 埋め込み動画/静止画から指定色を透過させ、背景透過のPNG画像(連番)で書き出す方
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
This document discusses HTML5 elements like <article>, <section>, <header>, <footer>, and <div> tags for structuring web pages. It recommends using semantic HTML5 elements to build a modern website layout with sections for wrappers, headers, main content areas, and footers. The document also mentions supporting HTML5 in different browsers like Internet Explorer, Firefox, Chrome, and Safari.Read le
CSS3アニメーションの基本:脱エンジニアっぽさ! クライアントの笑顔を引き出すCSS3アニメーション(1)(1/3 ページ) エンジニアの立場でデザインまで積み上げていくのは、なにかと難しいもの。脱エンジニアっぽさを演出し、クライアントの笑顔を引き出す、CSS3アニメーションを紹介する。 クライアントさんからのさまざまな難しい要求を解決し、ようやく納品にこぎ着けたのに、クライアントさんから出た言葉は「ちょっとやぼったいね……」というつぶやき。Webエンジニアの方からよく耳にする嘆きの声です。エンジニアの立場でデザインまで積み上げていくのは、やはり難しいですよね。 しかし、いわゆる外観としてのデザインの他に、クライアントさんを「おっ!」と思わせる便利な手法が1つあります。それは「アニメーション」です。 Webサイトでの小気味良いアニメーションは、そのユーザー体験を豊かなものにしてくれます。
JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 (7/3追記: twitter等で教えていただいた内容を追加しました) +v (数値化) var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります(例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります)。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v
display:table-cell; を活用する リキッドレイアウトのコーディングにすごく便利。 親要素に display:table; 子要素に display:table-cell; 記事リストなど、画像とテキストを横並びにするときに。 均等に横並びにしたいときに。 タップ時のカラー設定 CSSで以下のように設定。アルファ値も設定可能。 -webkit-tap-highlight-color: rgba(255,105,183,0.6); 画像、iframeに max-width を指定 img・iframeは、サイズが大きすぎて画面からはみ出すことがあるので max-width:100%; を指定する。 word-break:break-all; を指定 スマホは幅が狭いため、長いURLなどが1行に入りきりません。 word-break:break-all; を適宜指定する。 フォ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く