[https://www.synergy-marketing.co.jp/](https://www.synergy-marketing.co.jp/) 上記のサイトのようにメインビジュアルの背景とテキストを自動でかつ左右のボタンクリックで切り替えるようにしたいのですが、どのようにしたらよいのでしょうか？現在は下記のコードで自動でフェードイン・アウトで切り替えするところはできておりますが、ここからボタンを追加して切り替える方法がわからない状態です。 ```html

テキスト０１
テキスト０２
テキスト０３

aaaaaaaaaa
bbbbbbbbbb
cccccccccc

``` ```js //背景自動切り替え var speed = 1000; // フェードイン・フェードアウトの処理時間（1000で1秒） var times = 5000; // 画像切り替えの間隔（1000で1秒） var bgimages = [ 'images_c/mainvisual_cafe.png', 'images_c/mainvisual_school.png', 'images_c/mainvisual_consulting.png' // 最後に,をつけない ]; var position = ['0','0', '0']; $(function(){ // 現在の背景画像番号格納する変数 var thisnum = 0; // 定期的に実行 setInterval(function(){ // 背景をフェードアウト $("#main_visual .inner .inner_bg").fadeOut(speed,function(){ // 背景画像番号変更 thisnum = thisnum === bgimages.length - 1 ? 0 : thisnum + 1; // 背景画像を変更しフェードイン $(this).css({"background-image":"url("+bgimages[thisnum]+")","background-position":position[thisnum] + " 0"}).fadeIn(speed); }); }, times); }); //テキスト自動切り替え $.fn.autoChange = function(config) { // オプション var options = $.extend({ effect : 'fade', type : 'repaet', timeout : 3000, speed : 1000 }, config); return this.each(function() { // カウンター初期化 var current = 0; var next = 1; // 指定した要素の子要素を取得 var element = $(this).children(); // 全ての要素を非表示にする $(element).hide(); // 最初の要素だけ表示する $(element[0]).show(); // 要素を切り替えるスクリプト var change = function(){ // フェードしながら切り替える場合 if (options.effect == 'fade') { $(element[current]).fadeOut(options.speed); $(element[next]).fadeIn(options.speed); // スライドしながら切り替える場合 } else if (options.effect == 'slide') { $(element[current]).slideUp(options.speed); $(element[next]).slideDown(options.speed); } // リピートする場合 if (options.type == 'repeat') { if ((next + 1) < element.length) { current = next; next++; } else { current = element.length - 1; next = 0; } } // 最後の要素でストップする場合 if (options.type == 'stop') { if ((next + 1) < element.length) { current = next; next++; } else { return; } } }; // 設定時間毎にスクリプトを実行 var timer = setInterval(function(){change();}, options.timeout); }); }; // 自動切り替えする要素の設定 jQuery(function($){ $('.catch-left-title').autoChange({effect : 'fade', type : 'repeat', timeout: 5000, speed : 2000}); $('.catch-left-text').autoChange({effect : 'fade', type : 'repeat', timeout: 5000, speed : 2000}); }); ``` ご教示宜しくお願いします。

	@@ -1 +1 @@
1	- 背景とテキストをボタンクリックで同時に切り替えたい
1	+ 背景とテキストをボタンクリック＋自動で同時に切り替えたい

質問編集履歴