2013年10月17日のブックマーク (18件)

  • よくある質問っぽいののjQueryを使ったサンプル|CSS HappyLife

    2007年12月6日追記 IE6で選択中のタブの上が切れていたのを修正しました。 具体的にはcss/style.cssの35行目にfloat: left;を追加しております。 いろんなサイトで見かける「よくある質問」。 一番多いパターンは、リストで質問があって、アンカーで回答に飛ばす方法だと思うです。 特別ソレがいけてないとかは思わないんですが、飛んだ後に「戻るボタン」で戻らない人とかは、毎回ページトップ押したり、スクロールして戻ったりと案外手間だったりするわけです。 それならそういった手間が掛かるかも知れないことを少しでも省けないかしら?って事で、jQueryを使ってタブ型で折りたたまれたよくある質問っぽいサンプルを作ってみました。 (単純にボクがこのスタイルが一番見やすくて好きってだけだったり) サンプルページ サンプルダウンロード(Zip:20KB) メインのCSSファイル (サンプ

    よくある質問っぽいののjQueryを使ったサンプル|CSS HappyLife
    laconic
    laconic 2013/10/17
    質問をクリックすると回答が表示される「よくある質問」作成例
  • HTML5 における HTML4 からの変更点

    この文書は「HTML5 differences from HTML4 (W3C Working Draft 25 May 2011)」の日語訳です。 原文の最新版 は、この日語訳が参照した版から更新されている可能性があります。 この日語訳は参考情報であり、正式な文書ではないことにご注意ください。また、翻訳において生じた誤りが含まれる可能性があります。他の仕様の訳については Web 標準仕様 日語訳一覧 を参照してください。 更新日: 2011-09-15 公開日: 2011-05-26 翻訳者: 矢倉 眞隆 <yakura-masataka@mitsue.co.jp> HTML5 における HTML4 からの変更点 2011年5月25日付 W3C 草案 (Working Draft) この版: http://www.w3.org/TR/2011/WD-html5-diff-2011

  • 【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1

    HTML5版の新規でサイトを作るのに使えそうな一式です。 今までの新規で使えそうな一式のVer3からも有る程度流用はしていますが、結構いじってます。 今までみたいに、社内のマークアップエンジニアとかそういう人がもう居ない環境なので、何処かで使われていた訳ではありませんが、まー最初の準備って地味に面倒なのでちゃちゃっと始めるには良いんじゃないでしょうか。 【HTML5】新規でサイトを作るのに使えそうな一式。Ver 1をDL(zip:12kb) HTML5版のVer 1を見る 社内のマークアップエンジニアとかって書いたら、これどうなのよ?とか話してた頃がちょっと懐かしくなった。 コーダー飲みとか、CSS Niteなんかで、マークアップエンジニアやコーダーさんと会う機会は結構有るのに、そういう具体的な?話まではしないからなぁ・・・ それはさておき、中身のご説明などを続きにて。 中身のご説明 zi

    【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1
    laconic
    laconic 2013/10/17
    新規サイト制作セット参考/HTML5
  • 【Sass】新規でサイトを作るのに使えそうなの一式。Ver 1

    シリーズっぽくやってたSassを覚えようですが、今回は今までご紹介したSassに関する知識が有れば、直ぐにでも使えそうな一式をご用意しました。 まぁ、HTMLとかは過去の新規でサイトを作るのに使えそうなの一式。とそんなに変わってないので、SCSSファイルだけ有れば良いと思いますがHTMLとかあった方が確認もそのまま出来るので良いかなーと。 【Sass】新規でサイトを作るのに使えそうなの一式。Ver 1をDL(zip:約50kb) 実際のページを見る ページを見ても、あんまり意味が無いっすね。えぇ。 いつもの新規セットに比べると、ボク自身がSassはまだ全然使いこなせて無いですし、開発中と言うかベータな感じが否めないので、コレをベースにSassを色々試したりするのに良いかなと思います。 なので、一つの参考までにって感じでしょうか。 んでは、続きにて中身の説明なんぞをしていきます。 中身のご説

    【Sass】新規でサイトを作るのに使えそうなの一式。Ver 1
    laconic
    laconic 2013/10/17
    新規サイト制作セット参考/Sass使用
  • 新規でサイトを作るのに使えそうなの一式。Ver 3

    随分前に、Ver2の見直しをして3になってたんですけど、公開してなかったので今更ながら公開です。 中身は2を使ってみて、社内のマークアップエンジニアからフィードバックもらったり、自分でも違和感が有った部分を調整してます。 それなりの期間使ってみて、問題をあんまり感じていないので、完成度としては大分良くなったかなぁって思います。 新規でサイトを作るのに使えそうな一式。Ver 3をDL(zip:40kb) Ver 3を見る Ver.3の中身ご説明 主な変更点を。 style.cssのwidthなどのプロパティをまとめていたのをVer1と同じに。 default.cssに書かれていた、p要素のmargin-bottomの指定をstyle.cssに移動。 default.cssのfont-familyの指定を若干変更。 index.htmlGoogleカスタムサーチ用に使えるソースを記入。 Ja

    新規でサイトを作るのに使えそうなの一式。Ver 3
    laconic
    laconic 2013/10/17
    新規サイト制作セット参考/XHTML1.0 Strict
  • CSSのfont-family:ヒラギノとMS Pゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ

    CSSでのfont-familyの指定がとても悩ましい。文字コードによって表示が変わったりするし、イレギュラーケースまで想定すると煩雑なコードになってしまう。ちょっと整理しながら考えてみる。 まず、font-familyを何も指定しないと、だいたいのブラウザではデフォルトで設定されているフォントで表示されるのだが、文字コードがUTF-8だとWindowsのIE6で英数文字が「Times New Roman」になってしまう。※文字コードがShift_JISやEUC-JPの場合はデフォルトのフォントで表示される。 それでは例えば総称ファミリー名(generic-family)である「sans-serif」のみ指定してみると、WindowsのIE6では文字コードがShift_JIS・EUC-JPの場合は「Lucida Sans Unicode」で、UFT-8の場合は「Arial」で表示されてしま

    laconic
    laconic 2013/10/17
    font-familyの指定について
  • IE6でよく遭遇するCSSのバグとその解決方法 | コリス

    Dave Woodsのエントリー「IE6 -CSSのバグとその解決方法」から、IE6でよく遭遇する3つのCSSのバグとその解決方法の意訳です。 IE6 - CSS Bugs and Fixes Explained IE6で、マージンが2倍になってしまうバグ IE6で、hasLayoutプロパティによって起こるバグ IE6で、小さい高さを指定した場合に起こるバグ IE6で、マージンが2倍になってしまうバグ IE6で、フロートした要素のマージンが2倍になってしまうバグと解決方法の紹介です。 下記のコードで、IE6はマージンが20pxになります。 sample:バグ #navigation{ float: left; width: 200px; margin-left: 10px; } #content{ float: right; width: 500px; margin-right: 10p

    IE6でよく遭遇するCSSのバグとその解決方法 | コリス
  • [CSS]気をつけたいIE 7のバグ -CSS-Discuss

    CSS-Discussにアップされている「IE 7 Bugs」の意訳です。 省略している箇所も多数あるので、原文も参照ください。 Internet Explorer Win Bugs - css-discuss 注意: バグには、IE7のみでなく、IE 5, 5.5, 6のものも含まれています。 公開されてから時間が経っているためか、ちょっと古いものもあります。 IEのフォントサイズのバグ フォントサイズの継承 IEの相対指定のフォントサイズの継承は、うまく機能しません。 相対指定を行う場合、emより%で指定を行う方が便利です。もし、em指定を行う場合は最初に%指定を行ってください。 例: body{ font-size: 100.01%; } ※100%の代わりに100.01%を使用するのは、Operaでの継承バグの回避のためです。 キーワード指定でのサイズ フォントサイズに「small

    [CSS]気をつけたいIE 7のバグ -CSS-Discuss
  • 黄金比をサイトのデザインに取り入れる簡単な3つの方法 | コリス

    その調和された比率は、トランプカードなどの日常的なものから、ギリシアのパルテノン神殿、ミロのヴィーナス、モナリザなどの芸術分野まで、多数存在します。 黄金比を使ったデザイン テクニックついては、下記も参考にどうぞ。 黄金比とは、黄金比を使ったすごいデザインテクニックのまとめ -Webデザイン・紙デザインに 黄金比を矩形に使用する 黄金比をマージンに使用する 黄金比をパーツに使用する 黄金比を矩形に使用する サイトで使用する画像などの矩形に黄金比を適応します。 サンプルでは、144pxと233pxの組み合わせを使用していますが、「1:1.6」を利用して100pxと160pxなど簡易なものでも効果はあると思います。 黄金比を横長の矩形に使用 黄金比をマージンに使用する レイアウトにグリッドシステムを取り入れマージンを使用した場合、数種類のサイズが必要になる場合が多くあります。 その際、1つの値

  • WEB制作のスキルに薬事法と医師法の知識は必要ではないかという提案

    品関係のショッピングサイトには細心の注意が必要となる。 ホームページ作成をする上で、最も注意しなければならないのが、法律的トラブルの回避です。 その為に契約書と規約というものを必ず設ける必要があります。 例えば、大学生の人が、アルバイトで何も考えずにホームページを受注し、相手から出された資料を元に作成したとします。 渡された資料が、既に薬事法に違反していたとします(かなり多い)。 こうした違反したページを作った場合、作成した会社と、WEB制作者に罰則が言い渡される事があります。 これを回避する為、かならずホームページ上での文章等の責任は、全て依頼元に委託する規約が絶対に求められます。 こうしたトラブル回避は、ある程度薬事法と医師法の知識さえあれば先に打開策を練る事が出来ますが、一般的WEB制作者の中には、言葉すら知らない人も居るでしょう。 今回は、こうしたWEB上での最もトラブルになりや

    WEB制作のスキルに薬事法と医師法の知識は必要ではないかという提案
    laconic
    laconic 2013/10/17
    健康食品、化粧品サイトで気をつけたいこと
  • CMSのポテンシャルを引き出す─MODxで作る商用サイト 記事一覧 | gihyo.jp

    第23回祝!MODx-2.2リリース-注目の機能 実践!Articles 中満英生 2012-02-03

    CMSのポテンシャルを引き出す─MODxで作る商用サイト 記事一覧 | gihyo.jp
    laconic
    laconic 2013/10/17
    MODx Revolutionの連載記事(全26回)/Revoの勉強用
  • 網的脚本実験室 / ホームページ制作・CMS運用に役立つスクリプト情報&実験ブログ

    明日11日(土)は、大田区産業プラザPiOにて「PHPカンファレンス2014」が開催されます。 国内最大のPHPイベントということで、私も数年前から毎年参加していますが、各セッションも非常に濃い内容でとても勉強になります。 複数のセッションが同時開催されるため、参加したいセッションが同じ時間帯に開催されることも多々あり、すべてのセッションを聞くことができないのが残念というかもったいないですが、できるだけ効率よくセッション間を移動しようと思います。 MODX用スニペット「accessBySSL」ですが、cfFormMailer,cfFormDBに続き、またまたyamaさんからコミットしていただきました。 いつも当にありがとうございます。 以下、変更内容です。 絶対パスのみを変換 Small fix $modx->makeUrl()関数の引数を調整 $_SERVER['HTTP_HOST']

    laconic
    laconic 2013/10/17
    MODxのメールフォームスニペット配布
  • http://chibinowa.net/modx/

    http://chibinowa.net/modx/
    laconic
    laconic 2013/10/17
    MODxの基本的な使い方解説サイト、テンプレート変数の具体的な使用例など
  • HTML、XHTML、CSS、PHP、JavaScript、MODxを中心とした情報発信サイト - Phize on the Web Web

    Phize on the WebはPhizeのポートフォリオ・資料・実験サイトです。 [おすすめツール] 愛用者だけが、この2年間でライバルたちに埋められない差をつけました。誰も教えたがらなかった最強のSEOサービス・キーワードツール。特別オファーを受けられる最後のチャンスです。 更新履歴 2010-04-17 phiEditedonプラグイン(1.1.2) 2010-04-17 SEO Strict URLsプラグイン(Phize版) 2010-01-13 ホーム 2009-10-21 DocLinkスニペット(1.0.2) 2009-09-02 ユーザーエージェント年表 2009-08-11 DateTimePickerプラグイン(1.1.0) 2009-03-18 Add Guides EX(1.0.0) 2009-03-17 カラムウィザード(1.0.0) 2008-10-30 M

    laconic
    laconic 2013/10/17
    MODxを便利にするスニペット配布、指定ドキュメントへのリダイレクト他
  • Let's enjoy MODx

    MODxを利用したサイトの実例、スニペットやプラグインの解説、サンプルなどを載せています。既存サイトのMODx化等ご相談承ります。注目記事を更新日順に表示しています 2007.06.20 00:33リソースのインストール方法について[ 覚え書き ]新着 2007.05.24 16:52MODx0.9.6の問題点と対策[ 覚え書き ] 2007.05.20 23:15Ditto 2.x と 1.x の違い[ 覚え書き ]新着 2007.01.15 16:56重いと思ったらキャッシュを疑え[ 覚え書き ] 最近更新したページ(新着も含む)5件を更新日順に表示しています 2008.08.24 13:35FAQList 0.2[ リソース解説 ]新着 2008.08.22 23:26FAQListサンプル[ MODxサンプル ]新着 2008.08.05 00:24インストール[ チュ

    laconic
    laconic 2013/10/17
    MODxのスニペット解説/必ずお世話になるサイト
  • WordPressより簡単なMODXの使い方 | MODX for Professionals

    panasonic cn mw200d manual 翻訳 · Download the Panasonic CN-MW250D CN-MW150D Manual. Brand: Panasonic File format: PDF. File size: 1266 KB. MD5 Checksum: 8FD2B6FA2F692B821F147A00D4348ACD Panasonicのカーナビゲーション、カーオーディオ、ITS ... CN-MW200D: 取扱説明書 取付説明書: CLICK CLICK CN-MW100D: Read More → principles of neurobiology pdf File Type PDF Principles Of Neurobiology cases, you likewise do not discover the statemen

    WordPressより簡単なMODXの使い方 | MODX for Professionals
    laconic
    laconic 2013/10/17
    MODxの基本的な使い方、具体的なサイト制作方法など
  • MODX JAPAN - トップページ

    Powered by phpBB® Forum Software © phpBB Limited Style by Arty - phpBB 3.3 by MrGaby Japanese translation principally by ocean プライバシーについて | 利用規約

  • MODx 日本公式サイト|トップページ

    MODX Evolution 1.0.25Jをリリースしました。PHP5.3で動作するバージョンとしては次が最後になります。

    MODx 日本公式サイト|トップページ
    laconic
    laconic 2013/10/17
    愛用しているCMS「MODx」の日本公式