Skip to main content
本文に 10 文字追加
ソース リンク
supa
  • 5,399
  • 4
  • 18
  • 41

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

■追記です。
class="n1"だけ1秒停止はどのように書いたらよいでしょうか。gochoさまのサンプルを使わせていただき、変数classNameListを入れてみましたが、以下では動きませんでした。stopの定義?関数の設定がわかりません。
if (classNameList='n1'){
setTimeout( 'stop',1000 );
}

if (classNameList='n1'){
    setTimeout( 'stop',1000 );
}

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

■追記です。
class="n1"だけ1秒停止はどのように書いたらよいでしょうか。gochoさまのサンプルを使わせていただき、変数classNameListを入れてみましたが、以下では動きませんでした。stopの定義?関数の設定がわかりません。
if (classNameList='n1'){
setTimeout( 'stop',1000 );
}

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

■追記です。
class="n1"だけ1秒停止はどのように書いたらよいでしょうか。gochoさまのサンプルを使わせていただき、変数classNameListを入れてみましたが、以下では動きませんでした。stopの定義?関数の設定がわかりません。

if (classNameList='n1'){
    setTimeout( 'stop',1000 );
}
本文に 119 文字追加
ソース リンク
kapimako
  • 205
  • 5
  • 16

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

■追記です。
class="n1"だけ1秒停止はどのように書いたらよいでしょうか。gochoさまのサンプルを使わせていただき、変数classNameListを入れてみましたが、以下では動きませんでした。stopの定義?関数の設定がわかりません。
if (classNameList='n1'){
setTimeout( 'stop',1000 );
}

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

■追記です。
class="n1"だけ1秒停止はどのように書いたらよいでしょうか。gochoさまのサンプルを使わせていただき、変数classNameListを入れてみましたが、以下では動きませんでした。stopの定義?関数の設定がわかりません。
if (classNameList='n1'){
setTimeout( 'stop',1000 );
}

本文に 240 文字追加
ソース リンク
kapimako
  • 205
  • 5
  • 16

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n31"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1とn2~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく
 以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n3"がclass="n2"に変更
2秒後にclass="n2"がclass="n1"に変更

あらかじめcssでは、n1とn2の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく
 以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});

jQueryでクラスを置き換えるにはどうしたらよいでしょうか。

1秒後にclass="n1"がclass="n10"に変更
1秒後にclass="n2"がclass="n1"に変更
2秒後にclass="n3"がclass="n2"に変更
3秒後にclass="n4"がclass="n3"に変更
4秒後にclass="n5"がclass="n4"に変更
5秒後にclass="n6"がclass="n5"に変更
6秒後にclass="n7"がclass="n6"に変更
7秒後にclass="n8"がclass="n7"に変更
8秒後にclass="n9"がclass="n8"に変更
9秒後にclass="n10"がclass="n9"に変更
10秒後は1秒後からの繰り返しです。

あらかじめcssでは、n1~n10の座標(position)を指定していますので、1秒ごとに移動するイメージです。
classは、n10迄、計10個ある為、jQueryでcssの位置を設定するのではなく、クラス名を変更したく以下、試しに書いてみても移動せず。ご教示お願いいたします。

$(function(){
    $(".n2")
    setTimeout(function(){
        $('.n2').toggleClass('n1');
    },3000);
});
ソース リンク
kapimako
  • 205
  • 5
  • 16
読み込んでいます