jQueryでレスポンシブ対応かつ切替可能なモーダルを作成する方法 | 株式会社チップディップ
今回は切り替えが可能なモーダルウィンドウの作成方法をご紹介します。 まずはデモページを用意したのでご覧ください。 今回はこれを作っていきたいと思います。レスポンシブにも対応していますので使い勝手は良いかと思います！ それでは早速、次項から詳しく説明していきたいと思います。 HTMLを記述 まずはHTMLを記述していきます。 HTMLを記述する <head> <link rel="stylesheet" type="text/css" href="css/style.css" media="screen" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script> <script src="js/func.js"></script> </head> <body> <di
びっくりするほど簡単！HTMLやCSSの作業なしで、Bootstrap 4のさまざまなページを作成できる無料ツール
さくっと短時間で、慣れれば1分！ デスクトップやスマホに対応したページを作成したい時にぴったりな無料のオンラインツールを紹介します。 HTMLやCSSの作業は一切不要で、Bootstrap 4ベースのさまざまなページをドラッグ&ドロップで積み木のように組み合わせて簡単に作成できます。 Froala Design Blocks Froala Design Blocks -GitHub Froala Design Blocksでは170種類以上のレスポンシブ対応のコンポーネントが用意されており、それらを好きなように組み合わせて、誰でも簡単にWebページを作成することができます。 作成したページは個人でも商用でも無料。詳しくはライセンスページをご覧ください。 短時間で、Bootstrap 4ベースのページを作成してみる 用意されているコンポーネント 短時間で、Bootstrap 4ベースのページ
レスポンシブ対応のLPをたった5時間で製作する方法｜dwango creators' blog（ドワンゴクリエイターズブログ）
ハローエブリワン、ジェイだ。 最近は増刊号でエブリワンに会える機会が増えて、俺も嬉しい限りだよ。 季節も夏が近づいてきて気持ちもハッピーなピープルが増えてきたんじゃないだろうか。 俺も日が長くなり太陽とコミュニケーションできる時間が増えて、自然との会話力が向上し、ハッピーサンシャインだ。この勢いで太陽の息子にでもなろうかな。 だが、太陽がでている時間が長くなったからといって、1日24時間の壁を突破できるわけじゃない。気を付けたいのはエブリデイ24時間ということだ。今日はこの24時間の中で巻き起こる、ドラマチックな案件に対処する方法をエブリワンに伝えよう。 エブリワンもこんな経験を一度はしているんじゃないだろうか。 企画担当：すいません。特設ページが急遽必要になってしまって、対応可能でしょうか。 デザイナー：えっと、いつまででしょうか。 企画担当：大変申し訳無いんですけど、明日の朝にリリース
wordpress 完全フリーのテーマ集 2014最新版
2014年が明けたと思ったらもう１月も終わり、早いもんですね。 早いと言えば、最近公開されたばかりのwordpressテーマ2014年版を紹介します。全て無料でダウンロードできる完全フリーなので気に入ったものがあればダウンロードしてみてはいかがでしょう。 よくある無料テンプレートはクオリティがいまいちで結局使わなかったりするものも多いのですが、こちらで紹介するのは有料版並のクオリティ。CMSの中でもとくに人気の高いwordpress。どれもフリーなのでさくっとダウンロードできます。 また、レスポンシブ対応でBootstrapをベースにレイアウトを組まれているものが多く、カスタマイズしやすいテンプレートが増えているのもありがたいところ。このまま使うも良し、wordpressコーディングの勉強に使うもよしの優良テンプレート集です。 Centrino SEO対策済みのテンプレート。レスポンシブに
レスポンシブコーディングのスニペットいろいろ - やっぱりWebが好き - Writing Mode
コーディングを自身でやることは少なくなってきたけれど、勘が廃れないように今でも時々デザインしたり、コーディングしたりってのも大事にしてます。たまにデザインやコーディングをするのは気分転換にもなるし、新しいテクニックを知っておくことだってまだまだ大切だと思うし。 今の僕は、作る仕事はできる限り任せる立場だと思うので、あくまでもやり過ぎない程度に、って考えてますけど。というわけで、最近覚えたスニペットまとめ。 レスポンシブでサイトを作ることが増えています。 予算やスケジュール、または技術的な問題など、レスポンシブで構築するのが難しいケースもありますが、今の僕はできる限りレスポンシブ優先で考えたいと思っています。 ワンソースで考えたほうが運用は効率的だと思うから。 Writing Modeは僕にとってレスポンシブデビューだったサイトで、今思うと「こうしておけばよかった」ってところはいっぱいありま
レスポンシブやらシンプルやらどれも一級品なのになぜか無料のWordPressテーマ90個!!!!!*frasm
最近WordPressネタが多いですけどさすがにこれはすごい こないだこの「frasm」愛着があるって書いたのに、もう衣替えしたいwwwww @shintarowfreshです。 とりあえずこのまとめだけはブクマしておくなり、なんなり、保管しておいた方がいいと思います。 圧倒的な質と量、しかも両立している。 どのくらいすごいかというと 全部のテーマ紹介にライブデモがついてる！すげえめんどくさいのに！ このページ自体のナビゲーションがもうすでに気持ちいい←あくまでも僕の意見 あのブロガーさんがどのテーマ当ててるかがわかるwww ちなみに僕が当てているYOKOも入ってますよ。 Fresh High-Quality Free WordPress Themes of 2012 | Showcases | instantShift Fresh High-Quality Free WordPress
レスポンシブWebデザインでテーブルを使う時の小技
tableやtr、tdなどのテーブル関連のタグのdsiplayプロパティを変更することでデザインを変更します。 tableタグのdisplayの値はデフォルトではtable、tdやthタグはtable-cellといった具合ですが、この値をblockやlist-itemなど他の値に変えます。 @media only screen and (max-width:420px){ tbody tr{ display: block; margin-bottom: 1.5em; } tbody th, tbody td{ display: list-item; border: none; } ..... } Chrome、Safari、Firefox対応。 IEではTableのdisplayを変更しても表示は変わらないようなので非対応です。 条件分岐コメントを使ってIEにはメディアクエリを読ませないよ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
