/ / js jqueryや他のプラグインを使って以下のような効果が得られますか? - jquery、css、twitterブートストラップ、jquery-ui、uislider

js jqueryやその他のプラグインを使用して下のような効果を得るにはどうすればよいですか? - jquery、css、twitter-bootstrap、jquery-ui、uislider

デスクトップ上

モバイルビューで

注:画像を参照してください

私が欲しいのは、通常のデスクトップビューでdiv(画像と段落を含む)はすべて表示されるはずですが、モバイルサイトでは、スワイプ付きの水平スライダと1度に1つのdivだけをスライド可能に表示する必要があります。

私はブートストラップjqueryを使用していて、他のプラグイン要求を使用する準備ができています。

どうやってこの効果を達成するのですか

回答:

回答№1は0

私は似たようなことをしました。携帯サイトでは、ページの読み込み時に表示したいものを除いて、それらすべてをに設定します。

display:none;

それならJquery / JSでは基本的にトグルしなければなりません他のdivs。ボタンがクリックされると、Jqueryは他のdivがすべて表示されている場合はそれを非表示にし、クリックしたものを「切り替え」(表示にします)

クリックするステップ/ボタンごとにこのスニペットを使用できます。

Div2のボタンをクリックすると、div1またはdiv3が表示されていれば非表示になります。それからDiv2を再表示します。

  $("#Button_Div2").click(function(){
$(".Div1:visible").toggle("slide");
$(".Div3:visible").toggle("slide");

$(".Div2:hidden").toggle("slide");
});