divのwidthをウィンドウサイズによって変える//JavaScript
Flashでは常にStage.widthでウィンドウサイズをとって、コンテンツの配置やサイズ等を可変にすることができますが、CSSはwidthを%換算にすることはできますが、他には無いかと思って考えてみました。
今回はFlashで作ったswfを#flashnaviに読み込むためのエリアですが、規定サイズ(ここでは1000px)以下の場合には1000pxより#flashnaviのwidthが縮まらないようにしました。
ウィンドウの幅は、Javascriptのwindow.innerWidthでとれるはず!と思いましたが、IEなどでは計算方法が異なるため、以下の方法を使いました。
下の例では、ウィンドウサイズが1000px以下の場合のみの記述ですが、elseやelse if等を使って、もっと細かく指定するといろいろと使えそうです。
//CSS//////////////////////////////////////////////////////////////////
#flashnavi{
width:100%;
}
//HTML//////////////////////////////////////////////////////////////////
<script language="JavaScript">
<!--
inW = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
if(inW<1000){document.write("<style>#flashnavi{width:1000px !important;}</style>");}
// -->
</script>
今回はFlashで作ったswfを#flashnaviに読み込むためのエリアですが、規定サイズ(ここでは1000px)以下の場合には1000pxより#flashnaviのwidthが縮まらないようにしました。
ウィンドウの幅は、Javascriptのwindow.innerWidthでとれるはず!と思いましたが、IEなどでは計算方法が異なるため、以下の方法を使いました。
下の例では、ウィンドウサイズが1000px以下の場合のみの記述ですが、elseやelse if等を使って、もっと細かく指定するといろいろと使えそうです。
//CSS//////////////////////////////////////////////////////////////////
#flashnavi{
width:100%;
}
//HTML//////////////////////////////////////////////////////////////////
<script language="JavaScript">
<!--
inW = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
if(inW<1000){document.write("<style>#flashnavi{width:1000px !important;}</style>");}
// -->
</script>