首页 > 编程语言 >视频直播网站源码,前端效果-css+javascript

视频直播网站源码,前端效果-css+javascript

时间:2023-08-01 14:24:12浏览次数:44  
标签:right javascript 直播 源码 css left

视频直播网站源码,前端效果-css+javascript

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        .box{
            width: 1366px;
            height: 600px;
            margin: 0 auto;
            background: url("./images/bg.jpg");
            overflow: hidden;
        }
        .left{
            float: left;
            width: 50%;
            height: 600px;
            background: url("./images/fm.jpg");
            transition: all .5s;
        }
        .right{
            float: left;
            width: 50%;
            height: 600px;
            background: url("./images/fm.jpg") right 0;
            transition: all .5s;
        }
        .box:hover .left{
            transform: translate(-100%);
        }
        .box:hover .right{
            transform: translate(100%);
        }
    </style>
</head>
<body>
<div>
    <div></div>
    <div></div>
</div>
</body>
</html>

以上就是 视频直播网站源码,前端效果-css+javascript,更多内容欢迎关注之后的文章

 

标签:right,javascript,直播,源码,css,left
From: https://www.cnblogs.com/yunbaomengnan/p/17596323.html

相关文章

  • 在线直播系统源码,vant 轮播图组件
    在线直播系统源码,vant轮播图组件 <template> <van-swipe:autoplay="3000"indicator-color="#1baeae">  <van-swipe-itemv-for="(item,index)inlist":key="index">   <img:src="item.carouselUrl"......
  • ArrayList源码
    add方法publicArrayList(){this.elementData=DEFAULTCAPACITY_EMPTY_ELEMENTDATA;}//添加元素publicbooleanadd(Ee){ensureCapacityInternal(size+1);//确保数组容量足够添加elementData[size++]=e;returntrue;}调用add方法往Array......
  • HashMap源码
    put方法finalVputVal(inthash,Kkey,Vvalue,booleanonlyIfAbsent,booleanevict){Node<K,V>[]tab;Node<K,V>p;intn,i;//这个p是开始定位到的Node或者TreeNodeif((tab=table)==null||(n=tab.length)==0)//如果数组是n......
  • 智慧校园源码:vue2+Java+springboot+MySQL+elmentui+jpa+jwt
    智慧校园综合管理云平台源码系统主要以校园安全、智慧校园综合管理云平台为核心,以智慧班牌为学生智慧之窗,以移动管理平台、家校沟通为辅。教师—家长一学校—学生循环的无纸化管理模式及教学服务,实现多领域的信息互联互通以及校园管理一体化、信息数据化、数据自动化。智慧班牌融合......
  • css修改滚动条的样式
    滚动条样式的修改是通过伪元素实现的:-webkit-scrollbar​滚动条整体部分​-webkit-scrollbar-button​滚动条两端的按钮​-webkit-scrollbar-track​外层轨道​-webkit-scrollbar-track-piece​内层轨道,滚动条中间部分(除去)​-webkit-scrollbar-thumb​内嵌滑块​-webk......
  • CSS 文字-背景图片纹理、背景视频效果
    1、背景图片纹理效果实现方案:搬运CSS代码:.pattern-overlay{font-size:60px;font-family:'microsoftyahei';background-image:url(./pattern01.jpg);-webkit-text-fill-color:transparent;-webkit-background-clip:text;}.pattern-overlay......
  • 国标GB28181视频平台LntonGBS(源码版)国标平台迁移服务器后无法启动的问题解决方案
    国标视频云服务LntonGBS支持设备/平台通过国标GB28181协议注册接入,并能实现视频的实时监控直播、录像、检索与回看、语音对讲、云存储、告警、平台级联等功能。平台部署简单、可拓展性强,支持将接入的视频流进行全终端、全平台分发,分发的视频流包括RTSP、RTMP、FLV、HLS、WebRTC等格......
  • 推荐魔娃西游源码
     演示地址:runruncode.com/shouyou/19503.html手游魔娃西游是一款受欢迎的手机游戏。这款游戏以中国古代神话故事《西游记》为背景,玩家可以扮演主角孙悟空,与其他角色一起展开冒险旅程。在游戏中,玩家将面临各种挑战和任务。他们需要完成各种任务,如打败恶魔、解救被困的角色以......
  • RocketMq消费原理及源码解析
    消费原理概览 先简单说下常见的rocketMq的部署方式,上图中broker为真正计算和存储消息的地方,而nameServer负责维护broker地 图中右侧consumemessage部分即是本文重点描述的部分,主要分为ConsumerGroup和Consumer,consumerGroup可以参考https://rocketmq.apache.org/docs/do......
  • CSS3
    1、什么是CSS如何学习CSS是什么CSS怎么用CSS选择器(重点+难点)美化网页(文字,阴影,超链接,列表,渐变.....)盒子模型浮动定位网页动画(特效)1.1、什么是CSSCascadingStyleSheet层叠级联样式表CSS:表现(美化网页)字体、颜色、边距、高度、宽度、背景图片、网页定位、网页浮动.........