优酷视频手机电脑同步站自适应宽高度的方法！

最新推荐文章于 2021-06-27 14:16:32 发布
最新推荐文章于 2021-06-27 14:16:32 发布
阅读量1.3k 收藏 1
点赞数
文章标签： 织梦建站

把下面的红色的地址换成你优酷的视频地址：
 

<iframe id="video" width="100%" src="http://player.youku.com/embed/XOTU2MTE1MDQw"  frameborder="0" allowfullscreen=""></iframe>

<script type="text/javascript">document.getElementById("video").style.height=document.getElementById("video").scrollWidth*0.8+"px"</script>

 

这样就可以实现电脑手机站视频自适应大小了
 

lhf0203
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
php视频随手机电脑变化,zblogPHP插入优酷（iframe框架）等视频，手机端自适应宽度方法...
weixin_36204992的博客
03-18 237
zblogPHP模板在插入优酷等第三方视频的时候，一般使用框架iframe或者embed，但现有的优酷爱奇艺等网站的分享代码，其中都有高宽限制，插入网页后，在PC端内容区宽度足够是正常显示的，但在手机移动端访问的时候，就会出现视频显示不全，过大的情况！下面分享一个解决优酷视频自适应的问题：代码中一般都有宽高方法一：每次插入视频代码的时候，都手动删除掉其中的width和height，然后通过CSS...
js实现优酷视频手机电脑自适应
珍惜时间
12-20 3151
大致思路就是先使用js判断访问页面的是手机还是PC端,然后对应显示不同的大小 js判断手机还是PC是使用的这位的源码《出处》 效果图：
优酷视频分享链接自适应屏幕的方法
GLyihu的博客
04-22 859
直接分享代码： <script> $(function () { resizeIframe(); $(window).resize(function () { resizeIframe(); }); }); //调整iframe尺寸的方法 function resizeIframe() { var expectWidth = $(document)...
微信在线视频电影网站源码，Html5手机在线自适应电影网站源码,帝国Cms响应式视频网站源码
06-18
演示地址：http://www.0766city.com/yuanma/2490.html 模板用帝国CMS最新版为核心。适合做视频播放和下载站点，默认可以播放优酷土豆腾讯等视频站点的视频（通用播放分享代码，非解析!），集成 CKPLAYER播放器，可以上传和外链自己的MP4、FLV格式的影片！自带帝国播放和下载权限，可以游客，普通用户，普通注册用户扣点和VIP包月包 年等权限播放和下载！自动响应各种平板手机移动设备！到手即可开站！
可自定义片头的腾讯视频无广告可全屏调用代码
weixin_30795127的博客
06-08 453
腾讯视频站蓝叶颇为喜欢，主要是被腾讯视频播放器给迷上了，那色调看着舒服，所以蓝叶经常性到腾讯调用视频；前些天蓝叶分享了一篇腾讯视频最新去广告调用代码的文章，今天蓝叶再分享个代码，通过此代码可以设置调用腾讯视频播放前的片头广告，可以隐藏腾讯的加载LOGO图，此代码用的播放器还是腾讯以前live.qq.com没改版前的播放器，虽老但目前还能正常调用腾讯视频，如果此代码对你有用，那就请复制到你所需要的地...
js实现iframe自动自适应高度的方法
10-24
有时，我们希望Iframe能根据其内部内容自动调整高度，以避免滚动条的出现，提供更好的用户体验。本篇文章将详细介绍如何使用JavaScript实现...希望这个方法能帮助你在开发过程中更好地处理Iframe的自适应高度问题。
Vue 自适应高度表格的实现方法
10-15
在Vue中实现自适应高度的表格是一项常见的需求，尤其是在处理大量数据时，保持页面布局整洁，避免全局滚动条出现，是提升用户体验的关键。本文将详细介绍如何在Vue项目中，特别是在使用Element-UI库的情况下，实现...
手机电脑模版自适应网站金融类
08-12
在当前的数字化时代，手机和电脑模版的自适应设计对于各类网站，特别是金融类网站来说，至关重要。自适应网站设计是一种技术，它允许网页根据访问设备的不同屏幕尺寸和方向自动调整布局、内容和功能，确保用户在任何...
手机电脑模版自适应网站物流类
08-12
通过使用媒体查询、流式网格和灵活的图片等方法，自适应网站可以确保在手机、平板电脑、桌面电脑等各种屏幕尺寸上都提供优质的浏览体验。 物流类网站的核心功能通常包括在线追踪、运费计算、服务查询、预约上门、...
手机电脑模版自适应网站 包装类
08-12
在当前的互联网环境中，自适应网站设计已经成为一种标准，它能确保网站在各种设备上，如手机、平板和电脑上都能提供优秀的用户体验。"手机电脑模版自适应网站 包装类"是一个专为实现这一目标而设计的解决方案。下面...
javascript实现youku的视频代码自适应宽度
12-12
由于是在网站编辑器里面编辑的内容，所以一直想通过CSS的方法来解决，可是找到的方式都有明显的缺陷，最终被迫采用脚本来控制列的高度，代码如下： 代码如下: <divstyle> <embedid=”movie”src=”http://player.youku.com/player.php/sid/XMjg4NzkzMjQ4/v.swf”allowfullscreen=”true”quality=”high”width=”90%”align=”middle”allowscriptaccess=”always”type=”application/x-sh
html embed高度自适应,腾讯优酷视频分享iframe,embed高度多种比例控制
weixin_35997546的博客
06-27 821
在做页面优化的时候，可以采用多种表现形式增加用户体验，如图片描述、文字说明、GIF动图、Flash、必要的锚文本、音频、视频等。虽然搜索引擎对图片、Flash、音视频都无法识别，但从用户角度看，用户会认为这个页面质量非常高，停留时间也会长得多。如果你的服务器对图片、视频等多媒体支持不佳，造成页面打开速度慢，影响用户体验的话，可以把附件放在7牛云、百度云等云平台，这些平台能提高网站加载、访问速度。如...
html5移动端引入优酷视频iframe自适应
Spider--Man
07-12 1万+
1、要引入的视频<iframe height=498 width=510 src="http://player.youku.com/embed/XMTI4MjU5OTA3Mg==" frameborder=0 allowfullscreen></iframe>2、css里设置iframe的宽度为100%3、根据屏幕宽度自适应，这里我设定视频16/9的固定比例window.onload = windo
使用 iframe 引用优酷和土豆和腾讯视频，支持 HTML5 手机 播放
beyond__devil的博客
08-21 4万+
写博客，只为记录项目中碰到的问题 使用百度视频上传，嵌入远程链接，然后在编辑器中自动转换为支持视频播放的html代码。 例如： 简单了修改了百度编辑器源码 默认的百度编辑器针对视频的处理有2种： 1.远程链接，会生成 标签 2.本地上传视频，会生成 标签，video是html5的标签，现在大多数浏览器都使用了，但是其支持的格式可能不是很多，具体也没研究，这个工作量太大，而且得不到
调用腾讯视频播放器APi代码
夏末、阳光依然耀眼...˜˜羽悠﹏ˇ⊙ˇ
11-11 1万+
调用腾讯视频播放器APi代码 调用腾讯视频播放器APi var video = new tvp.VideoInfo(); video.setVid("q0011iyvdam");//视频vid var player = new tvp.Player(750, 450);//视频高宽 player.setCurVideo(video);
在移动和PC自适应页面做视频弹窗控制小案例
范二青年的博客
11-21 1939
由于在视频专题页项目中需要链接腾讯视频，然后再在网页端以弹窗的形式展现，且需要弹窗显示时候视频播放，弹窗关闭时候视频停止，在之前的查阅资料中看到很多案例都说的不是很清晰，今天在经过多次尝试后终于成功了，分享一下，代码如下：引用的库 *需要用的有：jQuery, boostrap框架.* HTML 结构如下 <div class="list-group"
手机端wap站网页播放腾讯视频代码
龚清林的博客
09-18 9096
<div class="detail-con clear"> <div id="mod_player_wrap" class="mod_player_wrap"> <div class="mod_inner"> <div id="mod_inner" class="mod_player_section center mod_independent"> <div> <div id="mod_playe
在网页中使用iframe嵌入B站视频（腾讯视频同理）
热门推荐
DSH964的博客
07-08 5万+
先上效果：首先是自己的页面：点击图片后出现一个遮罩、遮罩上显示B站的视频：这个效果很常见，例如在索尼中国的网站中：点击图中的播放图标会出现腾讯视频的iframe窗口：那么下面来看代码：&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;style type="text/css"&gt
HTML5 <video> - 使用 DOM 进行自定义控制示例
xiaochuandujun的专栏
06-07 1872
HTML5的video虽然可用controls来展示控件，并进行控制播放暂停等，但是不同的浏览器显示的 效果可能不一样，所以很多时候我们需要使用Dom来进行自定义的一些操作和控制。下面是一个小例子。 当然效果不是很美观，若想好看的可以自己设置css样式等。 播放/暂停 大 中 小 您的浏览器不支持此HTML5 视频标签
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值