スマートな書き方ではありませんが、画面のサイズによって設定の違うbxsliderを読み込ませるようにしてみたらどうでしょうか?
CSSがどうされているかわからないので、その辺は適宜変更してみてください。
html
1<script>
2function slider() {
3 if ($(window).width() > 700) { // 画面のサイズが700pxより大きかったらPC用の設定に
4 $('.bxslider03').bxSlider({
5 auto: true,
6 pause: 6000,
7 speed: 1500,
8 easing: 'easeOutBounce',
9 minSlides: 1,
10 maxSlides: 3,
11 slideWidth: 340,
12 moveSlides:1,
13 pager: false,
14 responsive: true
15 });
16 } else { // そうでない場合(700pxより小さい場合)はスマホ用の設定に
17 $('.bxslider03').bxSlider({
18 auto: true,
19 pause: 6000,
20 speed: 1500,
21 easing: 'easeOutBounce',
22 minSlides: 1,
23 maxSlides: 1,
24 slideWidth: 0,
25 moveSlides:1,
26 pager: false,
27 responsive: true
28 });
29 }
30}
31$(document).ready(function(){ // ページ読み込み時
32 slider();
33});
34$(window).resize(function(){ // ウィンドウがリサイズされたら再読込み
35 slider();
36});
37</script>