vue 移动端项目，动态控制div距离底部的距离

最新推荐文章于 2024-04-30 14:40:20 发布

weixin_30737363

最新推荐文章于 2024-04-30 14:40:20 发布

阅读量2.1k

点赞数

文章标签： javascript 前端移动开发 ViewUI

原文链接：http://www.cnblogs.com/lml-lml/p/10207580.html

版权

本文分享了如何在Vue移动端项目中，利用JavaScript动态控制div元素与页面底部的距离，适应不同屏幕尺寸和滚动情况。

摘要由CSDN通过智能技术生成

<template>
    <div class="details">
        <com-nav-bar title="保险详情">
            <i class="iconfont icon-xiangzuo" slot="left"></i>
        </com-nav-bar>
        <div class="details-scroll-wrapper" ref="scrollWrapper" :style="{bottom:bottom + 'px'}">   //动态添加样式
            <div class="details-scroll-inner" :style="{paddingBottom:paddingBottom + 'px'}">
                <div :class="[productInfo.tips?'cate':'cates']">
                    <span>{
   {productInfo.tips}}</span>
                </div>
                </div>
            </div>
        </div>
        <div class="btn-bottom" ref="btnDetails">  //先算出这个的高度（因为这个