Question

我的网站是www.to-hawaii.com

当您在移动设备上看到该网站时，带有广告的左侧面板会一直移动到网站的底部。

在每个页面上，左侧面板由包含文件生成，当在移动设备上查看网站时，它会在内容下移动。该网站的结构是：

<div class="contentarea">
<div class="rightpanel"></div> / Even though it is called Right Panel this is actually the left panel
<div class="midpanel"></div> 
<div class="leftpanel"></div> / Which is actually the right panel
</div>

技术上是否可以在不改变网站的整体结构的情况下，在移动设备上进行以下更改 - 包含在页面上的指定位置，例如在照片库下，而不是在此面板上显示页面底部？

Answer 1

根据你的结构，我认为不会这样做。要实现您想要的效果，请创建一个只想在移动设备上显示的div的 Copy ，然后通过 CCS3 @media rule隐藏非移动设备的主要div 即可。您想在 rightpanel

下添加移动版 gallery 的示例

 <div class="gallery-container"></div>
 <div class="rightpanel_mobile"></div>

然后操纵css ......

<style type="text/css">
@media (max-width: 768px) {
    .rightpanel { //Main
        display: none;
    }
    .rightpanel_mobile { //Mobile
        display: block;
    }
}
</style>

仅在移动设备上更改网站结构和div位置

1 个答案: