偶然发现的镜像网站

2018-03-01  本文已影响0人  查无此人_chazz

b站的镜像网站
扒了下代码,发现只是一个iframe配合css实现的 其中核心css代码如下

<style>
        .mirror_ifrom
        {
            -webkit-transform:scaleX(-1)
        }
    </style> 

其中 核心代码为 -webkit-transform 属性
该属性的作用就是缩放
其中scaleX(x) 是缩放X轴,scaleY(x)是缩放Y轴,sacle(x)是x/y同时缩放
我们需要的是对称的页面,所以将x轴缩放一倍即可达到效果


以下是iframe部分代码

  <iframe src="http://www.bilibili.com"  width="100%" style="border-bottom: 0px; padding-bottom: 0px;" height="100%" frameborder="0"  class="mirror_ifrom" sandbox="allow-forms allow-scripts allow-same-origin allow-popups"></iframe>

由于bilibili有非父页面重定向的设置,所以会导致iframe引用后跳转到B站去
所以将自己的iframe调整为和B站同源的效果 增加 sandbox属性

sandbox="allow-forms allow-scripts allow-same-origin allow-popups"

以上! 感兴趣的胖友可以试试

上一篇 下一篇

猜你喜欢

热点阅读