เนื่องจากเคยทำ
embed flash ให้กับลูกค้าแล้ว
มันมาบังเนื้อหา จะใช้
z-index เพื่อกำหนดลำดับก็ไม่ได้ เพราะ flash มันเหมือนไม่รู้สึกรู้สากับ
z-index ทีเ่ราตั้งไว้เลยแม้แต่น้อย มาดูวิธีแก้ไขนี้กัน
ตัวอย่าง embed <embed height="300" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high"
src="......................" type="application/x-shockwave-flash" width="700"></embed>
ซึ่ง ไม่ว่าคุณจะทำแบบนี้
<style>
div .content { z-index:-9999; }
</style>
<div class="content">
<embed height="300" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high"
src="......................" type="application/x-shockwave-flash" width="700"></embed>
</div>
หรือแบบนี้
<style>
embed { z-index:-9999; }
</style>
<embed height="300" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high"
src="......................" type="application/x-shockwave-flash" width="700"></embed>
เราต้องใส่ tag เพิ่มเติมเข้าไปใน <embed นั่นคือ
[ wmode="transparent" ] จะทำให้
<embed flash ไม่มาซ้อนกับเนื้อหาที่เราทำไว้ สาเหตุเนื่องมาจาก flash มันจะ active ให้เป็น on top หากเราไม่ใส่ tag ดังกล่าวลงไปด้วย ทำให้ไปซ่้อนกับเนื้อหาที่เราลงไปแล้ว โดย flash เอง
ไม่สามารถใช้กับ z-index ที่เป็น CSS ได้ จึงต้องใช้วิธีเพิ่ม tag นี้เข้าไปครับ
เพิ่มเติมสามารถใช้ tag นี้ได้ครับ หากใช้
wmode="transparent" แล้ว flash มีปัญหา หรือไม่แสดงผล ให้ใช้ อันนี้แทนครับ
wmode="opaque"ตัวอย่าง
<embed height="300" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high"
src="......................" type="application/x-shockwave-flash" width="700" wmode="transparent" ></embed>
หรือ
<embed height="300" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high"
src="......................" type="application/x-shockwave-flash" width="700" wmode="opaque" ></embed>
