新着記事『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。
Firebugの使い方2 THE HAM MEDIA
以前に『意外と知られていない機能が多い！？Firebugの使い方』というエントリーを書いたところ、気づけばビックリなブクマ数がついたりする。 Firebugってかなりのコーダー（デザイナー）とか、Webに関わる人の多くはいれているアドオンのハズ(未調査なので自分の気持です)だけど、SaCSS参加者では使っていないって人が意外にもいたので書いたエントリーでした。そのブクマしている人の数やコメントをみると、やっぱりみんながみんな、使い切れているものでないですよね。 ということで、前回は紹介しきれなかったけど、こんな使い方してるよ～という自分の使い方を紹介します！ 不必要な要素は消してしまおう 前回のおさらいっぽい部分から。 いろいろなサイトをみてまわっていると、時々、「これ邪魔だな」とか思う要素がポッとでてきたりってしませんか？大きいモニタの時はそんなこと特に思わないのですが、小さいモニタを使
IEでもCSS3 その１（ie-css3）
この記事は公開から１年以上経過しており、内容が古くなっている可能性があります。 CSS3では、ブロックの角丸やグラデーション、ドロップシャドウなど非常に便利なスタイルがあるのですが、残念なことにIEでは対応しておりません。 しかし、IEでもそれらのスタイルを使用できるプログラムがいくつか存在しています。 「ie-css3」を利用する方法。（参考サイト：コリスさんのサイト） 「ie-css3」でできるCSS3機能は以下のとおりです。 border-radius：角丸 box-shadow：ドロップシャドウ text-shadow：テキストシャドウ 手順 １．まずはこちらのサイトから「ie-css3」をダウンロードしてください。 ２．次にスタイルにて、角丸・ドロップシャドウ・テキストシャドウの設定を行います。 .box{ padding:10px; background-color:#FFFF
WordPressを高速化する9つのステップ | PLUS
福岡を拠点に活動するPLUSではWebサイト制作・iPhone/Androidアプリの開発を行っています。 WordPressはそのままだとアクセスが増えた時に、重くなりがちです。プラグインも入れすぎるとさらに重たくなることに。このブログだと表示スピードが改善前は7.7ｓかかっていましたが、見直しを行って0.4sにまで改善することができました。表示スピードは離脱率や、SEOとしても重要な要素ですので、改善する余地は大いにあります。 高速化に役立つツール まずはじめに、改善に役立つツールを2つご紹介します。 一つ目はWebWait。URLを入れると、読み込み時間を教えてくれます。まずはどのくらい時間がかかっているのか、チェックしてみましょう。 次はGoogleの「PageSpeed Insights」。URLを入れるだけで、高速化に役立つTipsを教えてくれます。もともとGoogle社内で
RedLine Magazine : ボックス全体をリンクにしたい
ボックス全体をリンクにしたい まずはこちらの発想の元ネタのサイトの紹介。 Link Boxes (Ask the CSS Guy) やりたいことは上記ページの上部の画像のように、見出しやテキストを置いている部分をリンクボックス化したいという主旨。マークアップや正しい書式にこだわらないなら簡単にできるのだが、ちゃんとした事をしたい人向けのTips。 ※以下のソースは上記サイトからの引用です。 上記サイトの言いたい事を簡単な日本語にして主旨だけ書きます。 ※訳とかまとめ要らないという方はその先に「それ、jQueryでやってみる」とか書いてみたので良かったらそちらへ進んでください。 まず中身はこんな感じ。見出しとテキスト。 <h2>About Us</h2> <p>How my life story became a Hallmark movie.</p> これらをボックスにしてリンクを付けたけ
HTML5・CSS3時代のweb制作コンセプト
HTML5・CSS3対応のブラウザが増えてきて、制作のコンセプトも変化してきました。 プログレッシブエンハンスメントなどユーザーのブラウザ環境に焦点を置いた制作コンセプトをまとめました。 足りない知識を埋めながら書いたので一部認識が間違ってる箇所があるかも知れませんが、その場合はご指摘頂けると助かります。 Progressive Enhancement Graceful Degradation Polyfill Progressive Enhancement(プログレッシブエンハンスメント) どのブラウザでも基本的な水準のユーザーエクスペリエンスを提供をし、 新しく高水準のブラウザにはCSS3やjsなどでよりリッチなデザインや機能を提供するという考えです。 またProgressive Enhancementには下記の原則があります。 基本的な内容は、すべてのブラウザでアクセス可能である必要
yuga.js :: Kyosuke.jp
yuga.jsって？ ウェブサイトを作る上で面倒な部分を自動で実装したり、ちょっとした機能を簡単に追加したりするJavaScriptです。jQueryを使って作られています。Web制作を優雅にするために作られました。 設置方法 まず、ファイル一式をダウンロードし、読み込みたいサイトの任意のフォルダに配置します。 yuga.jsを使いたいHTMLファイルのhead要素でjavascriptを読み込みます。 <link rel="stylesheet" href="css/thickbox.css" type="text/css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/thickbox.js"></s
ブロックレベル要素の高さを揃えるheightLine.js[to-R]
ブロックレベル要素の高さを揃えるheightLine.js Web標準の日々のグループディスカッションで出たライブラリ案を作っていく企画、第一弾。 ブロックレベル要素の高さを揃えるjsライブラリを作ってみました。 このライブラリは新バージョンがあります。 レスポンシブWebデザインに対応した「jquery.heightLine.js」 CSSでは複数のブロックレベル要素の高さを揃えれないという問題があります。 このheightLine.jsは、複数のブロックレベル要素の高さを揃える事ができ、2カラムレイアウトや3カラムレイアウトのそれぞれのカラムの高さを揃えたり、複数のブロックレベル要素をfloatで配置する際の高さを揃えたりできる、便利なライブラリになります。 設置方法 head要素内にダウンロードしたheightLine.jsを読み込みます。 <script type="text/ja
![ブロックレベル要素の高さを揃えるheightLine.js[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
初心者さんのためのWebサイト制作に役立つリンク集
2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください！」との声が多いのですが、日本のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください！ ↑私が10年以上利用している会計ソフト！ Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため？何のため？Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム（Webサイトのレイアウト）を作成 Webサイトの骨組み: ワイヤーフレームを素早く・
jquery順番入れ替え
I’ve been using JQuery for a while now and really agree with its tag line that it’s the “The Write Less, Do More, JavaScript Library”. We’ve also got this code for dragging and dropping table rows that has proved very popular, so it seemed natural to combine the two and wrap up the table drag and drop as a JQuery plugin. Update: You can now read the latest docs at https://github.com/isocra/TableDn
Drag and Drop table content with JavaScript – Redips spideR Net
Drag and Drop table content with JavaScriptLast update on 22.03.2020. Content of HTML table cells can be dragged to another cell or another table. It isn’t difficult to define onMouseMove handler and change top / left element styles to move the object. In case with tables, you will have to determine somehow target cell. Attaching onMouseOver handler on TD elements will not work, because browser do
Allan Jardine | Reflections | KeyTable
I've put together a couple of other demos: Basic event listening Editing with a large table Integration with an HTML form Integration with DataTables Usage Using KeyTable on a plain HTML is as simple as creating a new object: var keys = new KeyTable(); By default, KeyTable will attach itself to the first table it finds in the DOM with the class 'KeyTable' and apply basic navigation controls. There
http://dev.iceburg.net/jquery/tableEditor/demo.php
REQUIREMENTS TableEditor is a jQuery plugin. It requires jQuery (1.0.3 recommended) and should be used in conjunction with Christian Bach's TableSorter plugin. Future versions will likely function independant of TableSorter. FILES tableEditor plugin by Brice Burgess Modified tablesorter plugin based off version 1.0.3 by Christian Bach README Use documentation in the works. See Example(s), Pro
jqueryTableRowCheckboxToggle pure-essence.net
tableRowCheckboxToggle Written for jQuery 1.2.3 (should continue to work for any newer versions) Click on any row, it will toggle the state of the applicable checkboxes On page load, it also labels the last row with the appropriate css class since it contains checked applicable checkboxes View source to get the gist of its usage You may customize it by changing the variable values at the beginning
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
caraldo.net - it転職 リソースおよび情報
chrome-life.com
ウェブ制作の時間を大幅に短縮する、今時のUIコンポーネントが簡単に実装できる -Chico UI
jQuery Column Filters : Tom Coote Web Development
Michael Leigeber
DataTables | Javascript table library