jQuery

スポンサーリンク

ヘッダー固定の場合のアンカーリンクのずれ

ページの一番上にヘッダーやナビゲーションを固定する場合、ページ内アンカーリンクがずれる問題cssで固定の分の調整をする.link-margin {margin-top:　-100px;padding-top:　100px;}スムーススクロー...

ウィンドウサイズによって使うj Queryを変えたい

ウィンドウズサイズに合わせてjQueryを使いたい場合はcssのようにブレイクポイントを使って切り替えられます。 if (window.matchMedia( "(max-width: 640px)" ).matches) { /* ウ...

ハンバーガーメニューでページ内リンクをクリックしたら閉じさせる

ディレクターが大好きなページ内リンク。制作の私から見ると見辛いし… ちょっとし調整も必要になるしで大嫌いです。 HTML <a href="#" id="panel-btn" class="pc-none"><span id="pan...

IEでもobject-fitが使えるようにするjQuery

WordPressなどのブログのアイキャッチ使用時の画像のサイズ調整に便利なのがobject-fit。しかし、IE非対応です。そのため、object-fitを使うとIEでは画像が変形してしまいます。最新のEdgeは対応済みのようで崩れ...

アンカーリンクをクリックしたらハンバーガーメニューを閉じる

//spメニュー $(function() { $("#panel-btn").click(function() { $("#panel").fadeToggle(500); $("#panel-btn-icon").t...

固定されたヘッダーのアンカーリンクに最適「smooth-scroll.js」

■GitHubでダウンロード html <script src="js/smooth-scroll.polyfills.min.js"></script> js <script> var scroll = new SmoothScro...

スライダ―を入れるとアンカーリンクがずれる

ページ内のアンカーリンクだと問題ありませんが、別ページからのアンカーリンクだと、アンカーの場所がおかしくなってしまうことがあります。これは、スライダーで使っているjQueryやcssが読み込まれる前にアンカーリンクが着地するためです。先...

スクロールで特定の位置にまで行ったら実行

せっかくjQueryで動きを付けても、ページの表示と同時に実行されてしまうと、目につかない場合があります。見せたい位置までスクロールしたら実行してあげましょう。簡単です！動かしたい位置のタグにクラス名やid名を付けて「セレクタ」に入...

ウィンドウサイズによってjQueryの記述を変える

レスポンシブでホームページを作るとき、ウィンドウサイズによってcssを切り替えます。 jQueryも変えたい時ってありますよね。ウィンドウサイズによってjQueryを切り替えたい時は下記のコードを。 //ウインドウサイズの横幅によって...

ヘッダーを固定していると別ページへのアンカーリンクがずれる

ヘッダーを固定しているサイトで面倒くさいのがアンカーリンク。ページ内でもページ外でも... ヘッダー固定している分すれてしまいます。そんな時はアンカーリンクをしているページにこちらのコードを。 ※ヘッダー固定が120pxの場合。 $(...

スポンサーリンク

次のページ

12