我的客户想要一个愚蠢的介绍页面,其中,onClick,仓库的门通向仓库本身(重定向到网站)。我创建了一个1920 x 1174 SWF,就是这样。可以看到here。正如您将注意到的,仓库和天空的背景包含在SWF中。只是一个小问题:有没有更好的方法呢?一种想法是从SWF中裁剪天空并使动画变小,以便可以在介绍页面上使用CSS居中。然后将背景图像变为天空。
我的大问题是调整大小。我的(可能是无知的)假设是,如果我使SWF非常大,可以缩小它以获得不同的分辨率并保持纵横比。
我已经尝试了 www aleosoft com / flashtutorial_autofit.html 中的两个建议,它们会严重扭曲我的SWF(可以看到here)。这是因为我的发布设置吗?
我转而使用JavaScript来获得某些答案。现在我正在调整swf onload到屏幕宽度和高度,因为窗口内部高度和内部宽度也会扭曲纵横比。我希望它像 www aleosoft com / flashtutorial_autofitexample.html
一样工作var w = screen.width, h=screen.height;
document.write('<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="'+w+'" height="'+h+'">');
document.write('<param name="movie" value="movie.swf">');
document.write('<param name="scale" VALUE="exactfit">');
document.write('<embed src="movie.swf" width="'+w+'" height="'+h+'"></embed>');
document.write('</object>');
我愿意将object / embed参数用作解决方案或JavaScript。我宁愿不使用jQuery,但如果有必要,我会。
答案 0 :(得分:0)
以下代码(不需要javascript)不会扭曲(在Firefox 10,Ubuntu; Firefox 4.0,Windows XP; IE 6和8,Windows Xp上测试):
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<title>Platinum Buyer's Club</title>
<style type="text/css">
html, body{
margin:0;
padding:0;
}
</style>
</head>
<body>
<object width="100%" height="100%" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0">
<param name="movie" value="http://www.example.com/example.swf">
<param name="quality" value="high">
<param name="wmode" value="transparent">
<param name="SCALE" value="default">
<embed width="100%" height="100%" src="http://www.example.com/example.swf"
quality="high" type="application/x-shockwave-flash" wmode="transparent" scale="default"
pluginspage="http://www.macromedia.com/go/getflashplayer">
</object>
</body>
</html>
然而,它似乎仍无法在MacOS浏览器上运行(不确定它是Flash插件还是浏览器问题)
答案 1 :(得分:0)
要获得最佳质量,您应使用stage.fullScreenHeight
和stage.fullScreenWidth
来确定窗口大小并处理窗口大小调整事件。
图像和建筑物的图片应该是一个单独的影片剪辑。
有一些AS3代码要做(应该放在电影的第一帧):
import flash.events.Event;
import flash.events.MouseEvent;
import flash.media.Sound;
import fl.transitions.Tween;
import fl.transitions.easing.*;
var t:Tween;
var u:Tween;
var i:Tween;
if(stage) init(null);
else addEventListener(Event.ADDED_TO_STAGE, init);
function init(e:Event){
stage.scaleMode = StageScaleMode.NO_SCALE; //You don't want to scale anything
stage.align = StageAlign.TOP_LEFT;
resizeHandler(null);
stage.addEventListener(Event.RESIZE, resizeHandler); //function that will be executed at every window size change.
/* some animations.
new Tween(object, "property", EasingType, begin, end, duration, useSeconds);
property - This is the name of the property which will be animated, it must be specified as a string (between quotation marks). Example: "alpha", "scaleX", "scaleY", "x", "y". so you can calculate this vaules depending on the current window size
*/
logo_mc.logo1_mc.visible = false;
logo_mc.logo2_mc.visible = true;
t=new Tween(bg_top_mc, "height", Strong.easeOut, bg_top_mc.height, 341, 2, true);
u=new Tween(diamonds_mc, "y", Strong.easeOut, diamonds_mc.y, 208, 2, true);
i=new Tween(gradients_mc, "y", Strong.easeOut, gradients_mc.y, 221, 2, true);
}
function resizeHandler(e:Event):void {
var sw = stage.stageWidth;
var sh = stage.stageHeight;
//put a footer at the bottom of window
footer_bg_mc.width = sw;
footer_bg_mc.y = sh - footer_bg_mc.height;
//specify ALL elements positions depending on the window size, it is called liquid layout
copyright_mc.y = stage.stageHeight - copyright_mc.height - 8;
//center
logo_mc.x = stage.stageWidth - logo_mc.width - 40;
//you can also scale text size
var format:TextFormat = new TextFormat();
format.size = Math.round(stage.stageWidth/20);
myTextField.setTextFormat(format);
gradients_mc.width = stage.stageWidth;
bg_top_mc.width = stage.stageWidth;
bg_site_mc.width = sw;
bg_site_mc.height = sh;
content_mc.x = 0;
content_mc.y = 0;
}
在您的xhtml中,您可以:
...
<head>
<style type="text/css" media="screen">
html, body { height:100%; background-color: #27262e;}
body { margin:0; padding:0; overflow:hidden; }
#flashContent { width:100%; height:100%; }
</style>
...
<body>
<div id="flashContent">
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="100%" id="index" align="middle">
<param name="allowFullScreen" value="true" />
<param name="movie" value="index.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#e7e7e7" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="index.swf" width="100%" height="100%">
<param name="allowFullScreen" value="true" />
<param name="movie" value="index.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#e7e7e7" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<![endif]-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object> ...
这种液体布局可能不是最适合您的解决方案,但您可以使用它来使文本适合窗口。您可以尝试“使这栋建筑漂浮”两侧都可以填充背景。如果你把所有尺寸都做得更好,这会使缩小尺寸的图像更好看,这是不正确的,这取决于算法。
您可以更好地坚持使用CSS和JavaScript。门可以留在SWF。