[JS]カスタマイズが豊富なグラフやチャートを描画するスクリプト -jqPlot
ツールチップやラインにシャドウをつけるなどカスタマイズが豊富な、グラフやチャートを描画する高性能なスクリプト「jqPlot」を紹介します。 <textarea name="code" class="js" cols="60" rows="5"> line1 = [['23-May-08',578.55],['20-Jun-08',566.5],['25-Jul-08',480.88],['22-Aug-08',509.84]]; line1.push(['26-Sep-08',454.13],['24-Oct-08',379.75],['21-Nov-08',303],['26-Dec-08',308.56]); line1.push(['23-Jan-09',299.14],['20-Feb-09',346.51],['20-Mar-09',325.99],['24-Apr-09',38
JavaScriptで画像のリンク切れをチェックする方法:phpspot開発日誌
JavaScript で、画像本来のサイズ(幅, 高さ)を取得する方法 - latest log JavaScriptで画像のサイズ(幅,高さ)をとる方法があって詳しく紹介されていて分かりやすいです。 ここで、画像のリンク切れをチェックする方法が書かれていなかったので書いてみます。 var img = new Image(); var url = '//phpspot.org/blog/img/notfound.jpg'; // あえて存在しない画像を指定 img.onload = function() { alert('width='+img.width+' , height='+img.height); }; img.onerror = function() { alert(url+' is dead'); }; img.src = url; 赤文字の部分を記述しておけば、エラー時に
[CSS]サイトのデザインに合わせて、visitedを色の変更以外で分かりやすくする方法
visitedのデザインを色の変更以外で分かりやすくするスタイルシートを9 Lessonsから紹介します。 Visited links strike out with CSS demo visitedに「text-decoration:line-through;」と「opacity」を指定しているのですが、「line-through」は「打ち消し線」もしくは「取り消し線」なので使用にはご注意ください。 当サイトのようにリンクに下線がある場合も、却って邪魔になるかもしれません。 使用するシーンは限定されますが、下記のサイトのようなデザインだとvisitedの打ち消し線と不透明度も違和感がないです。
SEOの順位を上げるためのWordPressプラグイン10 – creamu
WebDesignBoothというサイトで、SEOの順位を上げるためのWordPressプラグインが紹介されています。 ざっとご紹介。 » All in One SEO Pack ページごとにtitle、description、タグを設定できる » Broken Link Checker リンク切れをチェックしてくれる » Google XML Sitemaps Generator Googleサイトマップを作ってくれる » SEO Friendly Images 画像に適切なaltをつけてくれる » No Self Pings 自サイトへのpingbackを削除してくれる » Enforce www. Preference wwwありなしを統一してくれる » Platinum SEO Pack All in One SEO Packと同じ機能を持ち、さらにオプションを設定できる。しかし、
OpenOfficeの生産性を上げる拡張機能10選
印刷する メールで送る テキスト HTML 電子書籍 PDF ダウンロード テキスト 電子書籍 PDF クリップした記事をMyページから読むことができます OpenOffice 3を使っているのであれば、その機能をさらに充実させるために、拡張機能を追加することを検討しているかもしれない。しかし、OpenOffice.orgのウェブサイトを見れば分かるとおり、利用できる拡張機能は数多くあり、このリストすべてに目を通すのには時間がかかる。この記事では、読者の時間を節約するため、ビジネスの場面で役立つOpenOfficeの拡張機能をリストアップして紹介することにした。 1: Alternative dialog Find & Replace これは、標準的な検索と置換の機能に、次のようなすばらしい機能を追加するものだ。 検索テキスト・置換テキストに1つ以上のパラグラフを含めることができる 複数の
DD_belatedPNG.js。IE6で透過pngを表示させる決定版 | チバのブログ
IE6で透過pngを表示させるためのJavaScriptについて、IE6で背景画像に透過pngを指定してリピートさせるという記事でiepngfixを紹介したのですが、あれ重いですよね。 IE6で透過pngを表示させるためとはいえ、重い。 ということを思っていたら、ITキヲスクさんのIE6で透過pngを表示させるオススメscript、「DD_belatedPNG.js」という記事にDD_BelatedPNG.jsというとてもよさげなスクリプトが紹介されていたので、試してみました。 ダウンロードページ DD_belatedPNG.jsのデモページ DD_BelatedPNG.jsとその他のJSの違い 今までいくつかIE6で透過pngを表示するためのスクリプトはありましたが、それはAlphaImageLoaderフィルターを使って表示させていましたが、 AlphaImageLoaderを使うの
IE6でもCSS3の属性セレクタを使う | チバのブログ
jQueryではいろいろなセレクタが用意されています。これらのセレクタを使う事でIE6でもCSS3の恩恵にあずかれるということで数回に分けてまとめてみようと思います。 最初は属性セレクタについて。 属性セレクタとは特定の属性や属性値を持つ要素に対してスタイルの指定ができるようになるセレクタです。 属性セレクタを使うことで「特定の属性が存在する要素のみ」「ある属性の値が指定した文字列である場合のみ」などの指定ができるようになるので、マークアップがとても簡単になります。 jQueryで使える属性セレクタ jQueryでCSS3の属性セレクタを使う場合は以下の6つの属性フィルタ（Attribute Filters）を使います。 （他にもあるんですが、CSS3っぽいものだけ・・・） Element[attribute] Element[attribute="value"] Element[at
IE6でもCSS3の擬似クラスを使う | チバのブログ
ｊQueryをつかってIE6でもCSS3の恩恵にあずかるための解説第2弾。 前回は属性セレクタを扱いましたが、今回はCSS3の便利な疑似クラスをIE6でも使えるようにしてみましょう。 といっても、$()でCSSとおなじ指定をするだけなんですが･･･CSS3の疑似クラス CSS3にはいろいろな疑似クラスがありますが、jQueryで簡単に使えるようになるものとして、以下の疑似クラスについて解説したいと思います。 :nth-child(n) :first-child :last-child :empty :nth-child(n) ある要素のうち、その親要素のn番目の子要素にのみスタイルを指定する疑似クラスです。 たとえば、以下のようにかくと<div>のなかにある7番目の<p>要素にのみスタイルを指定することができます。 div p:nth-child(7) { color: #F00;
画像をアップしてカラースキームを眺めるサイト「Color Explorer!」 | チバのブログ
最近こういうのばっかり作っていますが、また作りました。 Color Explorer! アップロードした画像で使われている色をすべて抽出し、その中の色を選択するとその色が含まれているカラースキームをKulerから引っ張ってくる。 というだけのサイトです。 色によっては、登録がないものが結構あるんですが、暇つぶしにでも使っていただけたらと思います。
30 Fun & Creative Web Designs From DeviantArt - SpyreStudios
How many web designers can say that there are too many places to draw inspiration from? Exactly. None. Inspiration is welcomed from high and low, far and wide. Sure, there are CSS galleries you can check out or even other designers’ portfolios on Twitter or other social media websites, but what about DeviantArt? I have taken the time to gather some of the best, most creatively designed websites fr
クリエイター達の履歴書。クリエイティブに自分を伝える「30 Artistic and Creative Résumés」
以前Designdevelopでは「面接で差をつけるフリーデザイン履歴書集「38 More Beautiful Resume Ideas That Work」」と言う記事で、デザイナーの為のデザイン性のある履歴書を紹介しましたが、今日紹介するのは堅い履歴書ではなくて、クリエイティブでワンシートで見せる経歴書をまとめたエントリー「30 Artistic and Creative Résumés」を紹介したいと思います。 グラフィカルにまとめたものから、機能的にスキルをわかりやすく表現した物まで、様々な経歴書が紹介されています。 今回はいくつか公開されている物の中から気になったものをいくつかピックアップして紹介したいと思います。 詳しくは以下 どれも個性が溢れていてみていて面白いです。グラフなどで自己のスキルを相対的に表しているものなんかは一目でその人のスキルが分かって良いツールだと思いました
サルでも分かる(？)Potraceの使い方 | totoco.org
商業施設系は紙媒体広告のデータをもらえる事が多いんだけど、製造系のクライアントは写真は有ってもロゴの(デジタル)データ無い！ってなわけで、ビーナスのソフトでしこしことロゴのトレースするはめになることありません？ でもいちいち手作業でトレースするのって時間の無駄だし…、ポイントが多いのって面倒だし…って激しくナマケモノの私の前に現れたのが「Potrace」という名のフリーのオートトレースソフト。 “オートトレース+フリー”っていうキーワードでうちにたどり着く人が多いらしく、前からいい加減やろうと思っていたPotraceの使い方(Winの場合)をまとめてみました。実際に使用して学んだコツ(？)なんかも。ホントはマニュアルを和訳してみようなんて、高校英語レベルのくせに目論んでたんですが、激しく挫折^^; 今日は何故か“激しく”を連呼する気分。 必要な物 / スキャナ、トレースする画像(ココでは企
Chirumichiru Blog - ビットマップ画像をベクター画像に変換 Potrace
デザイン制作を開始したものの ロゴデータがなくて 既存ＨＰからキャプチャしたり データを要求してもgifが送られてきたり なんで自分の会社のロゴデータ持ってないの・・・？って不思議になることがあります。 まぁ その疑問はおいといて やっぱりロゴはベクターデータが一番使いやすい。 ということでロゴデータが無い場合 もらったgifなりbmpなりをベクターに変換してもらうサービスやツールをメモしておきます。 Vector Magic http://vectormagic.com/home ソフトをインストールすることなく変換できるけど、有料になっっちゃったみたい。 たしか昔使ったときは無料だったんだけど・・・英語読めないのでよくわかりません。 Potrace http://potrace.sourceforge.net/ ファイルをダウンロードしてきて、ちょいっと設定したら変換できちゃいます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSSでの文字スタイル調整に使えるオンラインツール「CSS Type Set」:phpspot開発日誌
http://outer-empires.com/Index.asp
みなジェネ