モバイル時のペインの位置の変更

デスクトップビューでは、左ペインとサイドペインがあります。左ペインには多くのコンテンツがあり、モバイルデバイスでレンダリングされたときにサイドペインがユーザーに見られないようになっています。モバイル時のペインの位置の変更

モバイルデバイスでレンダリングすると、最初に左側のペインがレンダリングされ、左側のペインの後ろにサイドペインがレンダリングされます。モバイルブラウザではサイドペインが左ペインの上にレンダリングされるようにこの動作を変更する方法はありますか？

レスポンシブデザインには、ブートストラップ、ファンデーション、その他のフレームワークを使用していますか？ –

DNN8は現在ブートストラップを使用しています –

特定の画面サイズで1つのペインを上下に配置するには、z-indexを使用します。これを行うには

、単にCSSを使用して、ペインのzインデックスを変更：

@media (max-width: 767px) { 
    .leftpane{ 
     z-index: 2; 
    } 
    .sidepane{ 
     z-index: 3; 
    } 
}

が、これはあなたのために働くなら、私に教えてください。ありがとう！

2016-08-26 19:07:41

最後にこれを実行すると、CSSの$（ 'leftPane'）への割り当てを変更する必要がありましたattr（ 'style'、 'display：block！important'）;しかし、それが走ったときには、左ペインをまったく同じ場所に置いてください。 –

Hmm。私はあなたの質問を誤解しているかもしれません。 1つのペインを他のペインよりも上にしたいですか？この場合、CSSの "z-index"プロパティを使用することができます。次に、画面のサイズに応じてz-indexを異なる値としてロードすることができます。 –

私はあなたが探していると思った答えを変更しました。これにより、サイドパネルがモバイルデバイスの左ペインの上に配置されます。左ペインにはクラス 'leftpane'があり、サイドペインにはクラス 'sidepane'が必要です。 –

スキンで見つかった最初の要素が最初にレンダリングされます。それを（私が知る限り）変更する方法はありません。しかし、DNNスキンページで2つのdiv要素を切り替えることは簡単です。

<div id="SidePane" class="SidePane" runat="server"> 
<div id="LeftPane" class="LeftPane" runat="server">

代わり

<div id="LeftPane" class="LeftPane" runat="server"> 
<div id="SidePane" class="SidePane" runat="server">

の

しかし、CSSや皮膚のHTMLのデザインに応じて、これは簡単に修正があるか、完全にサイトのデザインを破壊する可能性があります。 DNN store（または別のベンダー）でスキンを購入した場合は、売り手に尋ねる価値があります。

2016-08-26 22:47:21 VDWWD

別のレイアウトのモバイル用に別のページを用意することで目標を達成できました。モバイルデバイスが検出された場合、DNNは別のページにリダイレクトする機能を備えています。

2016-08-31 19:05:35

答えて