JPHACKSは、2014年12月に東京大学を会場として始まった国内最大級の学生向けハックイベントで、第1回は、100名を超える学生が参加し、第2回の2015年は、全国5都市で200名を超える学生が参加しました。 第3回となる2016年度は、2016年4月にギブリーの技術顧問に就任した竹内郁雄が組織委員長に就任します。竹内 郁雄氏は、独立行政法人 情報処理推進機構(IPA)の「未踏ソフトウェア事業」統括プロジェクトマネージャーを務めており、現役のハッカーとしても有名です。竹内 郁雄氏を組織委員長に迎えた第3回は、“未来を担うイノベーターの発掘”をテーマに、全国6箇所で2日程に分けて開発イベントを行い、11月19日に東京大学武田先端知ビルにて、表彰イベントを行ないます。 JPHACKSは、ハックイベントを通じたイノベーターの発掘を目標に、2014年から、毎年1回開催しています。 第1回は、「
サンプルがうまく動かないときはページを再読み込みしてみてください。 また、エラーや間違い等を発見された方はぜひお知らせください。 オンズでは各スクリプトの実装のお手伝いも承っております。 比較的安価で最新・高機能なシステムを導入できますので、ご希望の方はお気軽にお問い合わせください。 お問い合わせはオンズのお問い合わせフォームからどうぞ。 記事に戻る © ONZE.
Bootstrap で、.navbar-collapse 内のメニューリンクをクリック(タップ)して同一ページのアンカーポイントへ移動すると同時に、.collapse メニューを閉じる処理についてメモ。 .navbar-nav 内のリンククリック時に.collapse メニューを閉じる Bootstrap からソースコードを拝借しますが、以下のようなヘッダーメニューがあるとして、 <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span>
更新日: 2017年5月29日公開日: 2015年6月17日jQueryを使いこなそう!便利すぎるプラグイン15選! web制作を強力にサポートしてくれるjQueryプラグイン!現在2,500以上のプラグインがリリースされており、多くのwebサイトでプラグインが活用されています。 ホームページビルダーなど自作のweb制作にも活用でき、その使い勝手はもはや未知数となっています。そんな便利なjQueryプラグインの一部を今回ご紹介します。 初心者でも使ってみたいjQueryプラグイン15選余白のカスタムならBackstretch Backstretch Yahoo! JAPANやgooなどのポータルサイトで見られる画面サイドの余白。掲載するコンテンツにもよりますが、余白が寂しいと思ったりしたことはありませんか。そんな時Backstretchを活用すると両サイドの余白を好きな画像で埋めることがで
jQuery を使って実装する方法が過去には一般的でしたが、フェードインだけであれば CSS だけで実装が可能です。 現在このページもその CSS が適用されていますので、ポワーンとフェードインでページが表示がされたと思います。更新する度にフェードインします。 CSS だけでフェードイン body { animation: fadeIn 2s ease 0s 1 normal; -webkit-animation: fadeIn 2s ease 0s 1 normal; } @keyframes fadeIn { 0% {opacity: 0} 100% {opacity: 1} } @-webkit-keyframes fadeIn { 0% {opacity: 0} 100% {opacity: 1} }body にアニメーションを施すことでフェードイン表示が可能です。これだけで簡単に
画像の遅延読み込みを行うJavaScriptライブラリ[Layzr.js]を紹介します。 ウェブページの読み込み時間短縮のために、ウィンドウの表示領域に入っていない要素や画像を非表示にしておいて、画面スクロールでウィンドウ内に入ってきたタイミングで表示切り替えを行います。 同機能のjQueryライブラリでは[Lazy Load]が有名ですが、今回紹介する[Layzr.js]ではローディングの時間短縮に直接は関係のないフェードイン表示機能などはカットして、最低限の機能だけを残してファイルサイズをより小さくしています。 より軽く、より早く。 遅延読み込みの本来の役割を重視した仕様になっています。 比較的簡単なステップで導入可能です。 ファイルのダウンロード まずは公式サイトからJavaScriptファイルをダウンロードします。 Layzr.js : http://callmecavs.gith
gulp、webpackでjqueryプラグイン(scrollmagic、tweenmax等)を使う時の設定JavaScriptjQuerygulpwebpack メモメモ 前提条件 * gulp-webpack、webpackがnpm installされている * bowerにてscrollmagic等のプラグインをインストールしている パスは適宜変更してください webpack.config.js gulpタスクが読み込む設定ファイルです。 var webpack = require("webpack"); var path = require('path'); module.exports = { output: { filename: "bundle.js" }, resolve: { root: [path.join(__dirname, "bower_components")]
可視範囲になってから表示されたり動いたり、スクロールに応じてアニメーションさせる方法を紹介します。動きをつけて目を引くことで、効果的に伝えることができるかもしれません。 以前、「jQueryを使って、スクロールしてコンテンツが現れたときにアニメーションさせてみる|Webpark」という記事で同じようなものを紹介したのですが、デモが気に入っていない、アニメーションが1度きりということで作り変えました。 まずはサンプルをご覧ください。スクロールするとアイコンとテキストが順番にフェードインします。 このサンプルで使われている、画面いっぱいに表示する方法と、上にスクロールしたときに現れるメニューは以前紹介しています。気になる方はどうぞ。 画面サイズに合わせて高さを指定する3つの方法|Webpark jQueryで作る、下にスクロールで消えて、上にスクロールで現れる固定メニュー|Webpark とい
Twitter Bootstrap の Navbar はレスポンシブな感じになっていて、ブラウザの横幅に応じて表示状態が変わります。デフォルトでは 横幅が768px以上 → ナビのメニューをふつうに表示 横幅が768px未満 → ≡ こんな感じのボタンだけが表示され、クリックするとメニューがにょろっと出現 (スマホっぽい) Bootstrap のサイトの一番上のメニューがそれですね、ブラウザの横幅を変えてみると勝手に表示が切り替わります、便利ですね で、 これをブラウザの横幅にかかわらず、常に ≡ ボタンだけが出ている状態にして、メニューをにょろっと表示させたい場合はどうするか Bootstrap のサイトでは、less を使って変数 @grid-float-breakpoint の値を変更してカスタマイズしてどうのこうの、と書かれているっぽい めんどくさい ということでとりあえず、以下の
A collection of inspirational websites made by real Squarespace users. Stories and solutions for the modern entrepreneur. In-depth guides and videos about the platform, our services, and how to get started. An online community for Squarespace users and professionals to discuss best practices and seek advice. Free, online sessions where you’ll learn the basics and refine your Squarespace skills. Ea
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く