P-L-P 小站
http://www.ped.jjvk.com/phpbb/

[網頁設計] iframe 相關
http://www.ped.jjvk.com/phpbb/viewtopic.php?f=1&t=724		 第 1 頁 (共 1 頁)
發表人:  mimiba [ 2014-02-27, 13:59 ]
文章主題 :  [網頁設計] iframe 相關
縮小 iframe 原始頁面大小

1. http://www.webdeveloper.com/forum/showt ... l-browsers

2. http://www.collaboration133.com/how-to- ... fari/2717/

3. http://www.carsonfarmer.com/2012/08/cro ... e-scaling/

小細節
代碼:
Note that if instead of -ms-zoom you use zoom, webkit browsers seem to ‘double scale’ everything, which turned out to be the root of my problem.

--> 解決 chrome 顯示的問題
發表人:  mimiba [ 2014-02-27, 14:46 ]
文章主題 :  Re: [網頁設計]縮小 iframe 原始頁面大小
在 iframe 中只顯示一部分的來源網頁


http://stackoverflow.com/questions/1411 ... -an-iframe

範例：引入 bloomberg 的 chart 網頁

代碼:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
#my-div
{
    width    : 650px;
    height   : 1000px;
    overflow : hidden;
    position : relative;
}

#my-iframe
{
    position : absolute;
    top      : -480px;
    left     : -150px;
    width    : 1280px;
    height   : 1000px;
}               
</style>
<body>

<div id="my-div">
<iframe src="http://www.bloomberg.com/quote/VNINDEX:IND/chart" id="my-iframe" scrolling="no"></iframe>
</div>

<body>
發表人:  mimiba [ 2014-02-28, 09:59 ]
文章主題 :  Re: [網頁設計] iframe 相關
混合型 iframe ( 縮小 + 擷取任意部分網頁）

代碼:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
#my-div
{
    width    : 650px;
    height   : 1000px;
    overflow : hidden;
    position : relative;
}

#my-iframe
{
    position : absolute;
    top      : -480px;
    left     : -150px;
    width    : 1280px;
    height   : 1000px;
    -ms-zoom: 0.8;
    -moz-transform: scale(0.8);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.8);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.8);
    -webkit-transform-origin: 0 0;
}               
</style>
<body>

<div id="my-div">
<iframe src="http://www.bloomberg.com/quote/VNINDEX:IND/chart" id="my-iframe" scrolling="no"></iframe>
</div>

<body>
第 1 頁 (共 1 頁) 所有顯示的時間為 UTC + 8 小時
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/