如何制作一个平滑的扩展div，从底部扩展到视区的85%？

要制作一个平滑的扩展div，从底部扩展到视区的85%，可以使用CSS和JavaScript来实现。

首先，需要创建一个div元素，并设置其样式为底部定位（position: fixed; bottom: 0;），并设置初始高度为0。

接下来，使用JavaScript来实现平滑扩展的动画效果。可以使用CSS的transition属性来实现平滑过渡效果。通过修改div元素的高度属性，将其从0逐渐增加到视区高度的85%。

以下是一个示例的代码：

HTML:

<div id="expandDiv"></div>

CSS:

#expandDiv {
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #f0f0f0;
  transition: height 0.5s ease;
}

JavaScript:

var expandDiv = document.getElementById("expandDiv");
var viewportHeight = window.innerHeight;

expandDiv.style.height = "0";

function expand() {
  expandDiv.style.height = viewportHeight * 0.85 + "px";
}

expand();

在上述代码中，通过JavaScript获取视区的高度（window.innerHeight），然后将div元素的高度逐渐增加到视区高度的85%（viewportHeight * 0.85）。

这样，当页面加载完成时，div元素会平滑地从底部扩展到视区的85%高度。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云对象存储（COS）。

• 腾讯云云服务器（CVM）：提供可扩展的云服务器实例，适用于各种应用场景，包括前端开发、后端开发、数据库、服务器运维等。了解更多信息，请访问：腾讯云云服务器
• 腾讯云对象存储（COS）：提供安全可靠的云端存储服务，适用于存储各种类型的数据，包括音视频、多媒体文件等。了解更多信息，请访问：腾讯云对象存储