PDA

View Full Version : اندازه متغییر iframe


justplan
شنبه 16 شهریور 1392, 13:39 عصر
سلام
من یک iframe در صفحه آوردم که میخواهم بهش اندازه بدهم
اندازه width ثابته

ولی اگر بخواهم اندازه ی ارتفاع یعنی height را متغییر کنم با % این کار انجام نمیشه

و این کار به این خاطر هستش که صفحه ای که به آن آدرس میدم در iframe اندازه اش تغییر می کنه ممکنه 1024 باشه ممکنه هم 500 باشه یا 2000 نمیدونم به خاطر همین نیاز دارم که ارتفاع آی فریمم به صورت اتوماتیک با اون صفحه تطابق پیدا کنه
qartalonline
شنبه 16 شهریور 1392, 13:44 عصر
از جاوا اسکریپت استفاده کنید.
justplan
شنبه 16 شهریور 1392, 13:48 عصر
چطوری این کارو بکنم
qartalonline
شنبه 16 شهریور 1392, 13:54 عصر
ارتفاع کل صفحه رو بگیرید سپس مفدار اون رو از عناصر موجود در صفحه (مثل هدر و فوتر) کم کنید سپس به iframe ارتفاع بدید.
ارتفاع iframe تمام صفحه است یا نه؟
tadayoni
شنبه 16 شهریور 1392, 14:12 عصر
آخر div خودتون کد زیر رو بنویسید دوست عزیز

<div style="clear: both;"></div>
qartalonline
شنبه 16 شهریور 1392, 14:23 عصر
آخر div خودتون کد زیر رو بنویسید دوست عزیز

<div style="clear: both;"></div>

مطمئنید که با این کد ارتفاع iframe بصورت درصدی از ارتفاع صفحه تغییر میکنه؟
qartalonline
شنبه 16 شهریور 1392, 14:28 عصر
با کد زیر هم میشه ارتفاع iframe رو 100% کرد البته من برای حالت تمام صفحه نوشتم.

<body style="margin:0;padding:0;overflow:hidden">
<iframe src="http://www.adress.com" frameborder="0" style="overflow:hidden;height:100%;width:100%;position:ab solute;top:0;left:0;right:0;bottom:0"></iframe>
</body>
tadayoni
شنبه 16 شهریور 1392, 14:42 عصر
مطمئنید که با این کد ارتفاع iframe بصورت درصدی از ارتفاع صفحه تغییر میکنه؟
این کد بصورت درصدی کار نمی کنه . فقط باعث میشه که ارتفاع iframe هرچقدر که باشه توی صفحه قرار بگیره و روی آیتم های دیگه نره
منظورتون رو از درصدی متوجه نشدم !!
qartalonline
شنبه 16 شهریور 1392, 14:51 عصر
این کد بصورت درصدی کار نمی کنه . فقط باعث میشه که ارتفاع iframe هرچقدر که باشه توی صفحه قرار بگیره و روی آیتم های دیگه نره
منظورتون رو از درصدی متوجه نشدم !!

فک کنم دوستمون پرسیدند که ارتفاع iframe مطابق با صفحه تغییر کنه.منظورم از "درصد" هم این بود.
justplan
شنبه 16 شهریور 1392, 17:59 عصر
من همه ی کدهایی که در این صفحه آوردید استفاده کردم
اولین کد را در دیوم قرار دادم ولی درست نشد

کد دوم دوستمون هم به قول خودتون اول که تمام صفحست البته با این حالم درست نشد فقط یه کم اندازش بیشتر شد

یکم بیشتر توضیح میدهم من دو تا صفحه دارم

یک:صفحه ای که iframe در آن قرار می گیرد
دوم:صفحه ای که آدرس آن را به iframe میدم
حالا این صفحه دوم اندازش باتوجه به مطالبش فرق می کنه مثلا اگر 5 خط باشه یه اندازه داره اگر 20 خط باشه یه اندازه داره و اگر 100 خط باشه یه اندازه داره
من میخوام iframe اندازه ی این صفحرو خودش تشخیص بده و اندازه iframe باتوجه به اون صفحه تغییر کنه؟؟؟!!!!!!
justplan
شنبه 16 شهریور 1392, 18:59 عصر
جواب این سوال را در این آدرس پیدا کردم
ولی اسکریپتش با اپرا و کروم مشکل داره
لطفا اگر میتونید این مشکل را حل کنید
آدرس اون صفحه
http://barnamenevis.org/showthread.php?43393-%D8%AA%D8%BA%DB%8C%DB%8C%D8%B1-%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%D9%87-iframe
qartalonline
شنبه 16 شهریور 1392, 19:47 عصر
کدتون رو قرار بدید تا بهتر بشه راهنمایی کرد.
justplan
شنبه 16 شهریور 1392, 20:10 عصر
این کدی هست که طراحی شده


<script>
function setSize(frame){
var b = frame.contentWindow.document.body;
var w = b.scrollWidth;
var h = b.scrollHeight;
if (w > 0) {
frame.width=w;
}
if (h > 0) {
frame.height=h;
}
}
</script>
<iframe src=test.html onload="this.contentWindow.top.setSize(this);"
onmouseenter="this.contentWindow.top.setSize(this) ;">
</iframe>
justplan
شنبه 16 شهریور 1392, 22:19 عصر
آیا راهی براش پیدا کردین؟!!!!
qartalonline
شنبه 16 شهریور 1392, 22:29 عصر
من کمی روش کار کردم ولی راهی واسش پیدا نکرم.
حتی کدی که شما دادین کار نمیکنه.
justplan
شنبه 16 شهریور 1392, 22:56 عصر
کد حاضر یه چند پیکسل اینور انوره ولی کدی که الان پیدا کردم خیلی دقیقتر هست



<script language="JavaScript"> <!-- function autoResize(id){ var newheight; var newwidth; if(document.getElementById){ newheight=document.getElementById(id).contentWindo w.document .body.scrollHeight; newwidth=document.getElementById(id).contentWindow .document .body.scrollWidth; } document.getElementById(id).height= (newheight) + "px"; document.getElementById(id).width= (newwidth) + "px"; } //--> </script> <IFRAME SRC="usagelogs/default.aspx" width="100%" height="200px" id="iframe1" marginheight="0" frameborder="0" onLoad="autoResize('iframe1');"></iframe>



ولی هنوزم همون مشکلو داره یعنی با کروم و اپرا مشکل داره
در ضمن این کد ار یک سایت عالی خارجی پیدا کردم که از جون مرغ تا جون آدمیزاد توی اون هست
البته با اپرا و کروم مشکل داره البته توضیحات تکمیلی توی این سایت زیاده فکر کنم درست کرده ولی من نفهمیدم خیلی....
این آدرسشه
http://stackoverflow.com/questions/819416/adjust-width-height-of-iframe-to-fit-with-content-in-it
justplan
شنبه 16 شهریور 1392, 23:44 عصر
راه نهایی پیدا کردم که در تمام مرورگرها جواب میده

<script type='text/javascript'>

function setIframeHeight( iframeId ) /** IMPORTANT: All framed documents *must* have a DOCTYPE applied **/
{
var ifDoc, ifRef = document.getElementById( iframeId );

try
{
ifDoc = ifRef.contentWindow.document.documentElement;
}
catch( e )
{
try
{
ifDoc = ifRef.contentDocument.documentElement;
}
catch(ee)
{
}
}

if( ifDoc )
{
ifRef.height = 1;
ifRef.height = ifDoc.scrollHeight;

/* For width resize, enable below. */

// ifRef.width = 1;
// ifRef.width = ifDoc.scrollWidth;
}
}

</script>


<iframe name="name" title="title" src="adress.html" scrolling="no" border="0" width="700" height="1600px" id = "myIframe" onload = "setIframeHeight( this.id )"> </iframe>


هماهنگ با مرورگر موزیلا، اپرا و اینترنت اکسپلور
در همه ی این ها به صورت اتوماتیک اندازه ارتفاع محاسبه می شود به صورت دقیق البته توی کروم جواب نمی ده ولی چون ارتفاع را کردم 1600 کردم دیگه مهم نیست...