タグ

jnzmのブックマーク (230)

  • ゼロからはじめるHTML5でのサイト制作/最終回 ほとんどのCSSを変えずにxhtmlとHTML5で同じレイアウトを作成してみよう - MdN Design Interactive

    前回までの記事で簡単なレイアウトを作成して、xhtmlHTML5でマークアップしたものからHTML5の新要素の説明を行い、アウトラインを確認してみました。最終回となる今回はxhtmlHTML5のCSSをほとんど変えずに同じレイアウトになるように作成してみたいと思います。 HTML5でCSSを設定する場合は新要素に対応していないブラウザに対してどうするのか。まだ確定していないHTML5の要素が変更になった場合を考慮して、スタイルの設定を考えた方が後々の大きな修正を回避できるのでベターです。ただ今回のレイアウトはほとんど同じCSSを使うということで作成するので、多少気になる部分もあるかと思いますが、ひとつの例として見ていただければと思います。 解説:(有)ムーニーワークス 林 豊/田崎一成 前回まででアウトラインを確認したそれぞれのマークアップしたページのサンプルこちらにあります。 ●HT

    ゼロからはじめるHTML5でのサイト制作/最終回 ほとんどのCSSを変えずにxhtmlとHTML5で同じレイアウトを作成してみよう - MdN Design Interactive
    jnzm
    jnzm 2011/11/30
  • stackstock.net

    stackstock.net 2023 著作権. 不許複製 プライバシーポリシー

    stackstock.net
    jnzm
    jnzm 2011/11/08
    input type
  • taikikawakami.tk

  • DOM関数|DOM(Document Object Model): Element|JavaScript/DOM|PHP & JavaScript Room

    DOMとは? 2007/7/1 DOM(Document Object Model)とは、プログラムやスクリプトで使って(X)HTML・XML文書の構造やノードに動的にアクセスためのAPIです。 JavaScriptでは(X)HTML・XML文書をオブジェクトとして扱えます。 プロパティやメソッドで各要素にアクセスすれば、要素の情報を取得したり、その情報を書き換えることができるので、静的なHTMLを動的に変化させることができます。

    DOM関数|DOM(Document Object Model): Element|JavaScript/DOM|PHP & JavaScript Room
    jnzm
    jnzm 2011/10/19
    DOMプロパティ一覧、DOMメソッド一覧
  • デザインフェスタ ブース研究 - 妄想科學倶樂部

    今回、5年ぶりに出展したデザインフェスタ。前回の教訓を活かして事前にブース構築を考えての参加であったが、色々と予定外のことも生じた。そのあたりも踏まえ、また当日会場でサンプリングしてきたブースデザイン例を紹介しながら「良いブースの作り方」を考えたい。 今回は写真が多く長い記事なので続き記法で隠しておく。 インパクトで魅せるブースパターン デザインフェスタに限らず、屋台密集型展示ではどうしても客は「歩きながら左右を見渡しての流し見」をせざるを得ない。ブース数の多いデザインフェスタでは尚更である。すると、興味を惹くためには一瞬見ただけで何かを感じるだけの「オーラ」が必要になる。 経験的に言って、こうしたオーラを醸し出すために有効な手段は 大型でインパクトのある造形物 質量で圧倒 統一された雰囲気 のいずれかであろう。 1は作品傾向がものを言う。大きくて一目でインパクトを与えられる絵や立体造形を

    デザインフェスタ ブース研究 - 妄想科學倶樂部
    jnzm
    jnzm 2011/10/19
  • IconSweets 2

    Perfect icons for all your design work. IconSweets is a huge set containing over 1,000 custom designed icons. IconSweets 2 will quench your icon thirst for all your iPhone, iPad & Android apps or new web projects!

    jnzm
    jnzm 2011/10/18
    アイコン
  • css-eblog.com - このウェブサイトは販売用です! - css eblog リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    jnzm
    jnzm 2011/10/13
  • higash.net

    higash.net 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy

    jnzm
    jnzm 2011/10/04
    これは詳しい
  • CSSで「折り返す」pre

    ■ tDiary: この期に及んでspamフィルタを導入していない人は どういう人なのかな。 ツッコミ通知メールを使っていない(ので気づいてない) 自分の日記はRSSリーダに登録してない(ので気づいてない) 単なる面倒くさがり屋さん 未対策の日記は(RSS経由では)読むに耐えないので、どんどん購読先から消えてもらっているのだが。もったいない。せめてここのフィルタくらいは入れてくれないだろうか。簡単だからさ。 追記 書き漏らした「理由」: spamをまだ受けていない(でも予防措置はしておいた方がいいよね) そもそも日記を放置しっぱなしで更新していない(ので気づいてない) ■ CSS: 「折り返す」pre 人が作ったtDiaryのテーマをつらつらと見ていたら、見慣れぬ属性が書いてあった。こんなの。 white-space: -moz-pre-wrap; /* Mozilla */ white-

    jnzm
    jnzm 2011/09/30
    firefox等で行えなかったとき。firefoxの場合、widthを指定し、これのcss3用のスタイルをあてること
  • [CSS]IEのhasLayout関連のバグと解決方法をまとめたサイト -hasLayout.net

    IE6/7/8のhasLayoutが原因でおきるスタイルシートのバグとその解決方法をまとめたサイトを紹介します。 hasLayoutについては、以前のエントリで紹介しているので参照ください。 IEでのCSSのバグを回避するhasLayout hasLayout.net バグは現在、IE6(44個)、IE7(28個)、IE8(19個)登録されており、各ページにバグの解説、バグが生じるデモページ、バグの解決方法とそのデモページなどが掲載されています。 IEのCSS Bugs一覧表の一部 また、CSSのチュートリアルでは、IEの便利なトリックも掲載されています。 CSS Tutorial 例えば、下記のようにIEでクリックした際に生じる点線は、他の箇所をクリックしないと消えないため、クリック後しばらくして消したり、元から表示させない方法などが紹介されています。 クリック時に生じる点線の処理方法

    jnzm
    jnzm 2011/09/21
    まとめ。IEによって特定の値(hasLayout)が消える(持たなくなる)場合の対処法。関連:zoom:1;
  • IEにおいてfilter:alpha(opacity)を設定しても、currentStyle.hasLayout=falseだとが透明にならない。 - Enjoy*Study

    IEで不透明度を変更するために下記のようなコードを書いたのですが、対象のエレメントのスタイルによって、不透明度が変わらない場合があることに気がつきました。(IE6、7共に) element.style.filter = 'alpha(opacity=50)';だめだったのは、div要素に対して background-colorだけを指定したもので、これに対してwidthまたはheightを追加指定すると、ちゃんと不透明度が効いてきます。 なお、JavaScriptではなくcss上でfilterの指定を行っても同様でした。(width,heigthがないと効かない) script.aculo.us(v1.7.0)ではどうしているんだろうと、ソース(effects.js)を眺めてみたところ、Element.setOpacityでは特に考慮しているような処理は見当たりませんでした。(その先のpr

    IEにおいてfilter:alpha(opacity)を設定しても、currentStyle.hasLayout=falseだとが透明にならない。 - Enjoy*Study
    jnzm
    jnzm 2011/09/21
    対象のエレメントのスタイルによって、不透明度が変わらない場合がある
  • PHOTO STOCKER – 高解像度フリー写真素材_商用可能

    春山 有由希 / ハルヤマ ユウキ UX / UI Design HTML / CSS Graphic Design Photography Designer & Front-end developer 福岡でプログラマとして就職後、Web制作会社に転職し、デザイナーになりました。 ECサイト、テレビ局や番組サイトのデザイン、執筆や講師業などで経験を積んだのち上京し、株式会社Fablicで フリマアプリ フリル(現ラクマ)のUI/UXデザインを担当。 その後、楽天株式会社でデザインチームマネージャを担当したのち、 フリーランスのデザイナーを経て、現在は株式会社スマートバンクでデザイナーをしています。 MORE PROFILE

    PHOTO STOCKER – 高解像度フリー写真素材_商用可能
    jnzm
    jnzm 2011/09/13
  • 商用利用可 フリー写真素材 somephoto

    商用利用可・リンク不要・クレジット記載不要のフリー写真素材サイト「somephoto」へようこそ! 当サイトの写真素材は加工すれば個人利用、同人利用、商用利用についていずれも可能です。 リンクやクレジット表示の必要はありません。(著作権は当サイト管理人に帰属します。) 無加工での再配布はどのような形態でもできません。 利用の際は励みになりますので、リンクを貼っていただいたり、コメント等をいただければ幸いです。 サイトについて / お問合せ 素材数:2,207 pics

  • 地味に使えるCSS小技のメモ&サンプル集 - かちびと.net

    cssの小技的なテクニックが便利なので好きなん ですが、cssそのものが嫌いで覚えられないので カンペ的な記事を作ることにしました。便利な小技 は沢山あるんですが、特に自分が良く使いそうな Tipsをメモします。既に出回っている情報ばかりで 特に目新しい手法はありませんので何も期待でき ないです。 というわけで特にテーマも一貫性も無くて、ただ便利ってだけです。推奨されない方法もあるかもしれませんが、僕は細かいこと気にしませんのでそんな感じです。 内容も既出なのでお詳しい方にはお役に立てないですが、僕の個人的なメモなので適当に流して頂けると幸いです。 floatで並べたリストのセンタリング Sample01 コード .centered { position: relative; overflow: hidden; } .centered ul { position: relative; le

    地味に使えるCSS小技のメモ&サンプル集 - かちびと.net
    jnzm
    jnzm 2011/09/12
  • ist-jo.in - ist jo リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    jnzm
    jnzm 2011/08/25
  • Webサイトにおけるユーザービリティの復習をしたので、よくチェックするポイントをリスト化した - かちびと.net

    ユーザービリティに関して少し復習したので メモっておきます。初心忘れるべからずという 事で・・・Webサイトは基的にユーザビリティ を考慮したレイアウトやコンテンツが理想です。 もちろんケースバイケースではありますが、 これは全共通して言える、という事を忘れない ようにメモ書き。 というわけで、申し訳ないですけど目新しい事は何一つ無い内容です。 そもそもこのブログ自体ユーザビリティを考慮した設計とは言えません(「やっちゃダメなこと」もしています)ので全然説得力ない感じです。 いろいろとテスト&エラーをして行きたいのでご了承下さい。 はじめに 正しいユーザビリティはコンテンツによってケースバイケースだと思いますが基的には僕はヤコブ・ニールセンの考えに従っています。 全ての項目は「すべてが正しい」ものではありません。100のサイトがあれば100通りのユーザビリティが考えられるはずです。場合

    Webサイトにおけるユーザービリティの復習をしたので、よくチェックするポイントをリスト化した - かちびと.net
    jnzm
    jnzm 2011/08/10
  • http://oalp.org/doc/nilesen/

    For full functionality of this site it is necessary to enable JavaScript. Here are the instructions how to enable JavaScript in your web browser.

    jnzm
    jnzm 2011/08/10
  • 【保存版】これを見たら、あなたの財布は確実に緩むであろう素敵すぎるネットショップ 101選

    こんにちわ。坪内です。 突然ですが、この2年ほどで集めた素敵なネットショップを一挙公開しちゃいます。はっきり言って、この記事書いてるだけで、何度もポチリかけたくらい、素敵なアイテムがてんこ盛りです。既に知っているショップも多いと思いますが、知らないショップがあったら是非チェックしてみてください。 ちなみに、数が多すぎて説明文書くのは断念しました。カテゴリ毎には分かれているので、実際にご自身の目で確認してみることをオススメします。

    【保存版】これを見たら、あなたの財布は確実に緩むであろう素敵すぎるネットショップ 101選
    jnzm
    jnzm 2011/07/29
    EC系デザインサイト
  • 9397澳门威利斯-威尼斯官网

    9397澳门威利斯是包含了新葡京、威尼斯人、金沙、BBIN电子、MG真人视讯、BET365等多个官方平台,游戏、体育、娱乐的第一首选,点击进入最新的游戏平台网址:www.813net,www.55402com,www.2018com,www.js9905com,为什么有的玩家能够在游戏中长赢吗?是因为他们知道了威尼斯官网技巧,9397澳门威利斯旗下拥有超千万的注册资金。

    jnzm
    jnzm 2011/06/03
  • これは必見かもなYoutube等の埋め込み動画を動的にリサイズするCSS例:phpspot開発日誌

    CSS: Elastic Videos これは必見かもなYoutube等の埋め込み動画を動的にリサイズするCSS例。 ブロックのサイズが変更された際において動画を固定サイズにしてしまうとレイアウトが崩れてしまいますが、公開されているサンプルを使うと、HTML5動画、embed/iframeの動画をレイアウトに合わせてCSSで自由に伸縮可能。 解像度の違う、iPhone等でも動作を確認しているそうで、どんな環境でも動画をページにフィットさせたい用途に有用です。 通常サイズ。ブロックいっぱいに広がる動画 幅をiPhoneなみに小さくしてみた例。動画も縮んでます。 IEでも動くみたいです。 これは覚えておいたほうがよさそうです。 関連エントリ フリーで新しめのXHTML/CSSで書かれたサイトテンプレート45 ぜんぶピュアCSSでやっちゃおうというJavaScriptの代替デモ56 Ajaxスタ

    jnzm
    jnzm 2011/06/01