div+css实现右下角悬浮表情菜单悬浮弹出子菜单效果代码-html代码-BFW代码库

div+css实现右下角悬浮表情菜单悬浮弹出子菜单效果代码

代码语言：html

代码描述：div+css实现右下角悬浮表情菜单悬浮弹出子菜单效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<html lang="en">

<head>
    <meta charset="UTF-8">

<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/all.5.15.3.css">
    <style>

    :root {
      --user-button-circle: rgba(0,0,0,0.025);
      --user-button-cardborder: rgba(255,255,255,0.25);
      --user-button-text:#323133;
      --user-button-shadow:rgba(0,0,0,0.1);
    }
    
    body #user-button {
      z-index: 1000;
      bottom: 1rem !important;
      right: 1rem !important;
      color: var(--user-button-text);
      transition: 1s 0s ease-out;
      -webkit-animation: slide 3s ease-out forwards;
              animation: slide 3s ease-out forwards;
    }
    @-webkit-keyframes slide {
      0%, 50% {
        opacity: 0;
        display: block !important;
      }
      100% {
        opacity: 1;
        display: block !important;
      }
    }
    @keyframes slide {
      0%, 50% {
        opacity: 0;
        display: block !important;
      }
      100% {
        opacity: 1;
        display: block !important;
      }
    }
    body #user-button .u-card {
      border-radius: 100%;
      box-shadow: 0 0 1rem -0.25rem var(--user-button-shadow), inset 0 0 1rem -0.75rem var(--user-but.........完整代码请登录后点击上方下载按钮下载查看