タグ

+参考記事に関するhaniworksのブックマーク (189)

  • JSONとJSONP

    JSONとJSONP ネタ元:JSONについての勉強メモ:外部URLから呼び出せない。どうやったら・・・ JSONやJSONPを利用したJavaScriptでのデータをの取り扱い方です。 JSONの場合 JSONはJSONについての勉強メモで書かれているようにデータをオブジェクトとして記述しておく方法です。 var jsonData ={"users": [ { name: "hamu", age : 24, language:["XHTML" , "CSS"] }, { name: "h2", age:25, language:["PHP" , "Java"] }, { name: "hoge", age:26, language:["JS" , "jQuery"] } ]} とJSONを定義しておけば、 for(var index in jsonData.users){ documen

    JSONとJSONP
  • jQueryオブジェクトとは?

    jQueryオブジェクトとは? このエントリーは軽めのjQuery Advent Calendar 2012の20日目のエントリーです。 よくjQueryの解説などを見ていると「jQueryオブジェクト」という単語が出てきますね。今回はjQueryオブジェクトとは何者かを解説をします。読み終える頃には少しだけJavaScriptに詳しくなれるよ。(若干長いです。) そもそもオブジェクトとは? さて、「jQueryオブジェクト」を解説する前にJavaScriptのオブジェクトについて解説します。JavaScriptのオブジェクトは非常に複雑なのですが、基だけでもわかるとJavaScriptやjQueryの学習効率が全然かわってきます。 まず、ざっくりと解説するとオブジェクトとは「プロパティ」と「メソッド」を持つ構造体のことです。 プロパティとは? ではプロパティとはなんでしょうか?プロパテ

    jQueryオブジェクトとは?
  • 画像の最大幅を calc() で制御する

    画像の幅をコンテンツに合わせてフレキシブルにしたい場合、親要素の幅を超えないようにするには CSS の max-width プロパティに 100% を指定する。 img { max-width: 100%; border: 1px solid silver; padding: 0.25em; } ただ、画像にパディングやボーダーを持たせた場合、その分が親要素の幅より大きくなってしまうことがある (Fig 1)。 Fig 1: パディングとボーダーを持つ画像に `max-width: 100%;` を指定すると、親要素の幅を越えてしまうことがある これをつねに親要素に収めるようにするには、box-sizing プロパティを利用して画像の幅がパディングとボーダー込みで算出されるようにする、という手がある。 img { max-width: 100%; border: 1px solid sil

    画像の最大幅を calc() で制御する
  • Takazudolog - OOCSSとSass

    CSS Preprocessor Advent Calendar 2012の10日目、@Takazudoです。 僕はSassが好きです。なぜならSassにはextendがあるからです。その理由を、社内勉強会で発表した、以下のスライドで話したことを補足しつつ、書きます。 OOCSS + Sass OOCSSってなんぞ まず、Sassのextendが素敵な点を紹介する前に、OOCSSについて簡単に紹介します。 OOCSSというのは、Nicole Sullivanという人が言い出した考え方です。そのプレゼン資料やビデオなどは、人が発表したものが、slideshare等にアップされています。 Object-oriented CSS Object Oriented CSS by Nicole Sullivan · Fronteers The Cascade, Grids, Headings, an

    Takazudolog - OOCSSとSass
  • 『モバイル時代におけるCSSの設計と実装』

    1 pixel|サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして、こんにちは。 ネット総合事業部プラットフォームDivの斉藤です。 今回は私の所属している部署からは初の1pixelへの寄稿となるそうです。 CSS開発のアプローチほぼ同時期にモダンウェブ開発に欠かすことが出来ないと言われるようになったJavaScriptと比べると、CSSにおける設計、という話題はなかなか出てきません。 単純なウェブサイトを作る際にはあまり気にしてこなかった部分ですが、ウェブアプリを制作している我々の仕事には欠かすことが出来なくなってきています。 ほかのプログラミング言語に比べると圧倒的に非力な言語だからこそ、ほかのプ

    『モバイル時代におけるCSSの設計と実装』
  • jQueryで正規表現を学んでみる。【基礎編】

    Posted: 2010.11.14 / Category: javascript / Tag: jQuery, 正規表現 正規表現といえばフォームチェックがぱっと思いつきますが、最近ではjQueryで外部APIで様々な情報を取得する機会が増え、それによって文字列の置き換えなどもできるようにならんとな、と思ったりしている人も増加しているはず! ということでお手軽に使えるjQueryを使用して正規表現をちょこっと勉強してみようと思います。 文字列を置き換える基の形 正規表現の前にjQueryで単純な文字列を取得して、置き換えて表示するということをしてみます。 html <p> 正規表現はjavascript以外のプログラムやテキストエディターなどの検索でも使えます。でもここではJavaScriptを使うんです。 </p> 例えばここにpタグでマークアップされた文字列があります。 「java

    jQueryで正規表現を学んでみる。【基礎編】
  • 少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck

    少ない手間と知識でそれなりに見せる、ズルいデザインテクニック with Sass / Compass (English Version) https://speakerdeck.com/ken_c_lo/zurui-design-technique-english-version 第一回…

    少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck
  • スマホ向けサイト制作3手法の基礎知識と課題、OS/機種依存のハマリどころ3選

    スマホ向けサイト制作3手法の基礎知識と課題、OS/機種依存のハマリどころ3選:スマホ向けサイト制作で泣かないための秘伝ノウハウ(1)(1/2 ページ) スマートフォン向けWebサイト構築支援ツールを開発・販売するため、国内すべてのケータイ・スマートフォン・タブレットを所有している企業に勤める筆者が、サイト構築のハマリどころとも言えるノウハウを紹介する連載。第1回は、PCやケータイと比べて際立ったスマホの特徴2つや、スマホ向けサイト制作3手法の基礎知識と課題、iPhoneAndroidなどOS/機種依存でのハマリどころをサンプルを交えて3つ紹介 連載開始に当たって 初めまして。KSKの「フレックスファームビジネスユニット」でエバンジェリストをしている渡辺と申します。筆者の所属するフレックスファームでは、スマートフォン向けWebサイト構築支援ツールの開発・販売を行っています。国内で販売されて

    スマホ向けサイト制作3手法の基礎知識と課題、OS/機種依存のハマリどころ3選
  • Learn web development  |  web.dev

    Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.

    Learn web development  |  web.dev