クリエイター：コーディング備忘録ブログ

RSS

コーディング

ページ外リンクにクラスを付与

2018.03.06

ページ外リンクにアコーディオンメニューなどがある場合、アンカーリンクで飛んだ、
リンク先のdiv要素に対してactiveなどのクラス名を付与したりする場合があります。

そんな時下記のスクリプトでクラス名を付与することができます。

<script type="text/javascript">
$(document).ready(function(){
    var anchor = $(location).attr('hash');  
    var point = $(anchor).offset().top;   
          
    $('html,body').animate({
        scrollTop : position
    }, 400);

    //class名を付与
    $(anchor).addClass('active');
});
</script>

1

2

3

4

5

6

7

8

9

10

11

12

13

<script type="text/javascript">

$(document).ready(function(){

var anchor = $(location).attr('hash');

var point = $(anchor).offset().top;

$('html,body').animate({

scrollTop : position

}, 400);

//class名を付与

$(anchor).addClass('active');

});

</script>

この記事を見た人は次の記事も見ています。

Repeater Fieldの表示件数の制御

前の記事

固定ページに個別でcssを読み込ませる

次の記事

コメント

0 コメント
0 トラックバック

この記事へのコメントはありません。

最近の投稿

アーカイブ

RELATED

コーディング

【-webkit-background-clip】文字にグラデーションをかける【ie非対応】

2017.03.28

コーディング

CSS Transform

2018.04.05

コーディング

画像をテキスト化してくれるサービス

2019.04.16

コーディング

SVGが表示されない場合

2018.09.26

コーディング

サイトに貼る画像

2021.06.17

コーディング

【イラストレーター】手のひらツール

2020.10.08