Midnight.js lets you switch fixed headers on the fly Scroll to try it out! The Header Create your fixed nav (or header) as you typically would. You can use whatever markup suits you, just make sure the header works well with position:fixed. The Sections After that, take any sections of your page that need a different nav and add data-midnight="your-class" to it, where .your-class is the class you
TOPjQuery jQuery.cookie.jsでクリックしたら次回から表示させないようにする jQuery.cookie.jsでクリックしたら次回から表示させないようにする 公開日:2015.11.20 更新日:2015.11.22 jQuery jQuery.cookie.jsを使えばcookie情報の取得、操作が簡単に行えます。 今回は既読にした要素を次回以降表示させないようにする方法をご紹介します。 お知らせをポップアップで表示した時などに使えるかも。 デモページ jQuery.cookie.js配布元 MITライセンス デモページでは、「次回以降は表示させない」ボタンをクリックすると、それ以降はそのボックスが表示されなくなります。 「このサイトのcookieを消す」をクリックしてリロードすると再びボックスが現れます。 ダウンロードしたファイルには色々入っていますが、今回使うの
Hero Slider A full-width, responsive and easy to customize slideshow. It is a common approach to fill in the intro section of a website with a slideshow: you're trying to show the users as much as you can above the fold, yet you want to deliver this information in an organized and clean way. Therefore we built for you a ready-to-use JavaScript slider, with some built-in options like video/image b
こんにちは。 今回はjQueryで上スクロールと下スクロールで違う処理をする!です。 広告とかを表示したい時等にたまに上スクロールと下スクロールで違う処理をしたい時ってありますよね。 今回はそれのメモ書きです。 [javascript] $(function() { var before = $(window).scrollTop(); $(window).scroll(function() { var after = $(window).scrollTop(); if(before > after) { 上スクロールした時の処理 } else if(before < after) { 下スクロールした時の処理 } before = after; }); }); [/javascript] beforeという変数が最初のスクロールの位置を取得しています。 afterが後のスクロールの位置を
The best! Proud of being the most complete framework of its kind. Trusted by the most innovative companies. Compatible Working in modern and old browsers too! Even IE 9! Make a beautiful site for all! Not just a few! Easy! fullPage.js is designed to be easy to use and customize. It includes tens of examples, great documentation and both community and personal support.
Basic Setup Scrollify requires jQuery 1.7+. <! doctype html> <html> <head> <script> $(function() { $.scrollify({ section : ".example-classname", }); }); </script> </head> <body> <div class="example-classname"></div> <div class="example-classname"></div> </body> </html> Configuration $.scrollify({ section : "section", sectionName : "section-name", interstitialSection : "", easing: "easeOutExpo", sc
paroller.js paroller.js is a lightweight jQuery plugin that enables parallax scrolling effect on selected elements. You can use it on elements with background property or on any other element. While scrolling elements can move: vertical, horizontal. Manipulated through html data-* attributes or jQuery options. Mobile ready. Easy to use. GitHub Download | Previous versions Before closing </body> el
I've always been curious about the jQuery JavaScript library. jQuery has captured the hearts of web designers and developers everywhere and I've always wondered why. I've been told it's easy, which is probably why designers were so quick to adopt it NOT that designers aren't intelligent, but designers usually have enough design stuff to worry about and if they wanted to be programmers, they would'
皆様こんにちは。普段はC++やってます。 本題に。 jQueryを用いて単にhtmlを読み込み表示する これは簡単です。 http://yokano-jp.blogspot.jp/2013/10/jquery-html_10.html より引用します <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jQuery load() sample</title> </head> <body> <h1>ここに外部 HTML ファイルを表示します</h1> <div id="page"></div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="load.js"></scri
Use available browser space to show images Make use of the full available browser space for enjoyable image viewing. Also supports the native HTML5 fullscreen API in modern browsers. For the most simple use case load the nessecary files and call the plugin after the ready event is fired: <link rel="stylesheet" href="css/fullsizable.css"> <script src="http://code.jquery.com/jquery-2.1.1.min.js"></s
alert()で出せるダイアログのスタイルを変更する為のスクリプトのご紹介。シンプルな発想で素敵ですね。尚、本スクリプトはjQueryに依存しています。 alert()で出せるダイアログのスタイルを変更しよう、というスクリプトです。 確かに普通にアラート出すよりいいかもしれません。 <script src="jquery.js"></script> <script src="sweet-alert.min.js"></script>コアとSweetAlertを読み込みます。 $('.foo').click(function(){ swal({ title: "アラートです!", text: "メッセージがココに入ります", imageUrl: 'http://placehold.it/500x500', confirmButtonText: '了解!', confirmButtonColo
CSS vs. JS Animation: Which is Faster? CSS AnimationよりもJavascriptを使った方がパフォーマンスが出るよ、というこの記事を見たので実際に試してみた。 結論 アニメーションさせる時は、Velocity.jsを使いましょう デモ DEMO1 - 画面下からスクロールインしてくるモーダルウィンドウ DEMO2 - 120個の丸が一度に動く、シンプルなアニメーション [source code @ GitHub] 機能比較 ライブラリ 特徴 メリット jQuery(animate()) 標準で組み込まれているアニメーションライブラリ ライブラリの読み込み不要 Velocity.js 標準のanimate()と同じ文法で使える拡張ライブラリ スピード最適化された実装 Transit CSS Animationを制御するためのライブラリ 3d-
<form class="form-horizontal" id="sendmail" method="POST" action="★sendmail.php へのパス★"> <span class=" glyphicon glyphicon-user"> 名前 ※必須</span> <div class="form-group"> <input type="text" name="Name" class="form-control" placeholder="Mao" dataCheck="mandatory"> </div> <span class="glyphicon glyphicon-envelope"> メールアドレス ※必須</span> <div class="form-group"> <input type="text" name="mailNo" class="form
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く