Cách nhúng Flash SWF tự động vừa với cửa sổ trình duyệt
Giới thiệu
Với sự ra đời của HTML5, các trang web lớn như Facebook và Twitter đều đã tiếp bước YouTube chuyển sang sử dụng công nghệ HTML5 để hiển thị video. Tuy nhiên việc thiết kế các file Flash SWF làm các banner cũng được khá nhiều trang web sử dụng vì tính gọn nhẹ và bắt mắt. Nhưng việc co giãn kích thước của Flash theo cửa sổ trình duyệt có kích thước khác nhau là cũng gây khó khăn cho người xây dựng website sử dung Flash. Bài viết này sẽ giới thiệu một số cách tự động vừa khít Flash với cửa sổ của trình duyệt.
Cách nhúng file Flash vào trang HTML
Thường để nhúng file Flash SWF vào trang web, chúng ta phải chỉ định rõ kích thước ở trong thuộc tính HTML tương ứng với kích thước thiết kế của Flash để trình duyệt hiển thị đúng Flash của bạn.
Xem đoạn code nhúng một Flash Movie, nó sẽ nhìn giống như sau:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="480" height="125">
<param name="movie" value="flashmovie.swf" />
<param name="quality" value="high" />
<embed src="flashmovie.swf" quality="high" type="application/x-shockwave-flash" width="480" height="125" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
Nhúng Flash tự động vừa khít nhưng hiển thị có thể bị biến dạng
Để tự động phóng to và vừa khít Flash với cửa sổ chứa nó, bạn nên thay đổi code như sau, thực thiện thay đổi thuộc tính width, height và thêm dòng PARAM với các thuộc tính của nó.
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="100%" height="100%">
<param name="movie" value="flashmovie.swf" />
<param name="quality" value="high" />
<PARAM NAME="SCALE" VALUE="exactfit">
<embed src="flashmovie.swf" quality="high" type="application/x-shockwave-flash" width="100%" height="100%" SCALE="exactfit" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
Kích nút “Xem ví dụ” bên dưới để xem kết quả. Bạn có thể hiệu chỉnh kích thước của cửa sổ trình duyệt, Flash sẽ tự độ phóng to và vừa khí với cửa sổ trình duyệt web.
Nhúng Flash tự động vừa khít nhưng hiển thị không bị biến dạng
Để tự động phóng to và vừa khít Flash với cửa sổ chứa nó mà không bị bóp méo, tức là Flash sẽ giữ nguyên tỉ lệ, bạn nên thay đổi thuộc tính value = “exactfit” ở ví dụ trên thành value = “default” .
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="100%" height="100%">
<param name="movie" value="flashmovie.swf" />
<param name="quality" value="high" />
<PARAM NAME="SCALE" VALUE="default">
<embed src="flashmovie.swf" quality="high" type="application/x-shockwave-flash" width="100%" height="100%" SCALE="default" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
Kích vào nút “Xem ví dụ” để xem kết quả. Bạn có thể thay đổi kích thước của cửa sổ trình duyệt và xem kết quả hiển thị Flash thay đổi.