![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
No.2ベストアンサー
- 回答日時:
ANo1です。
質問者様がどのような形で設置なさっているのかわかりませんが、とりあえず以下の形でテストしてみたところ動作しました。ご参考まで。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">
<head><title>Sample</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style type="text/css">
.slider, .slider img { width:600px; height:250px; }
.slider > div { position:relative; }
.slider > div span { border:1px solid gray; padding:2px; }
.slider .last { position:absolute; top:0; right:0; }
</style>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.2 …
<script type="text/javascript" src="./jquery.bxslider.js"></script>
<link type="text/css" href="./jquery.bxslider.css" rel="stylesheet">
<script type="text/javascript">
$(function(){
var s = $(".slider>ul").bxSlider({
auto: true,
pager: false
});
$(".slider .first").on("click", function(){ s.goToSlide(0); });
$(".slider .last").on("click", function(){ s.goToSlide(s.getSlideCount()-1); });
});
</script>
</head>
<body>
<div class="slider">
<ul>
<li><img src="./img/photo01.jpg" alt=""></li>
<li><img src="./img/photo02.jpg" alt=""></li>
<li><img src="./img/photo03.jpg" alt=""></li>
<li><img src="./img/photo04.jpg" alt=""></li>
<li><img src="./img/photo05.jpg" alt=""></li>
<li><img src="./img/photo06.jpg" alt=""></li>
<li><img src="./img/photo07.jpg" alt=""></li>
<li><img src="./img/photo08.jpg" alt=""></li>
<li><img src="./img/photo09.jpg" alt=""></li>
</ul>
<div><span class="first">to 1st</span>
<span class="last">to Last</span></div>
</div>
</body>
</html>
No.1
- 回答日時:
こんにちは
公開されているメソッドとして、goToSlideやgetSlideCountが用意されているようですので、これらを利用すれば良いのではないでしょうか?
http://bxslider.com/options
リンクをクリックしたら ~.goToSlide(0)などといった要領で。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
チェックボックスで画像を一括表示
-
Slick.jsのオプションrtlについて
-
high slideをFC2ブログで
-
bxsliderでスライドショーの間...
-
以前、ロールオーバー効果につ...
-
MAX関数を使ってからLEFT JOIN...
-
jqueryのsortableで一部ソート...
-
iframe内のリンクが飛ばないの...
-
javascriptでオブジェクトの重...
-
読み込んだQRコードをフォーム...
-
背景色を透明化
-
javascriptテキストBOX色を元に...
-
CSS 可変マージン
-
ダブルクォーテーションが消え...
-
JAVAで画像をボタンで切り替え...
-
CSSで指定したwidthをマウスで...
-
JSPでの画像ファイル表示
-
jQueryで同じクラス名のものを...
-
jspでcssが読み込めない
-
マウスオーバーで開閉できるア...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Slick.jsのオプションrtlについて
-
【jQuery】2分割レイアウトで、...
-
【iOS及びAndroid】リンク画像...
-
複数の要素へ appendchild でき...
-
キャラクターがぴょこんと飛び...
-
[jQuery]bxSlider 一番最後と...
-
qtipの使い方について
-
jQuery bxSlider でのアニメー...
-
横並びの画像を3枚時間差でフェ...
-
画像をフェードアウト&フェー...
-
javascriptで吹き出し
-
スライドショーの画像にリンク...
-
javascriptで文字サイズの変更
-
スライド機能について
-
順番にクラスをつけていく方法
-
自動でスライドし、伸び縮みす...
-
html内でのマウスオーバー時に...
-
CSSでマウスオーバーした画像を...
-
チェックボックスと画像切替の連動
-
high slideをFC2ブログで
おすすめ情報
ご回答ありがとうございます!
おしえていただいたメソッドを利用する方法を教えていただけますか?
やってみたのですが上手くいかず。。
すみません、大変初心者なもので、見当ちがいでしたらすみません。
何卒よろしくお願いいたします。
【HTML】
<a href="#" onclick="PrevIconTop();return false;">最初に戻る</a></p>
【JS】
function PrevIconTop() {
slider = $('.bxslider').bxSlider();
slider.goToSlide(0);
}