Jing + swfobject 2.2 = big video in small div

Question

I am trying to use swfobject 2.2 to display an swf, but the swf won't scale to fit the div that I'm putting it in. You can see what I've got here.

When it first loads, it is the right size, then it expands larger for some reason. If I right-click on the movie and select "Show All", it then fits perfectly.

Here is the code to generate the sfobject:

var flashvars = {};
var params = {}
params.scale = "showAll";
params.allowscriptaccess = "always";
var attributes = {};                    
swfobject.embedSWF("/content/tour.swf", 
"flashContent", "900", "700", "9.0.0", "expressInstall.swf", 
                       flashvars, params, attributes);

Any help/suggestions would be greatly appreciated!

Answer 1

To make the size of the div set the size of the swf (or rather the Flash Player) you can use "100%" for size in the swfobject.embedSWF() call, instead of a pixel size.

swfobject.embedSWF("/content/tour.swf", "flashContent", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attributes);

The other parameter to work with is scale. The alternatives are:

• "showAll": The entire application is visible in the specified area without distortion while maintaining the original aspect ratio of the application. Borders can appear on two sides of the application.

• "exactFit": The entire application is visible in the specified area without trying to preserve the original aspect ratio. Distortion can occur, and the application may appear stretched or compressed.

• "noBorder": The entire application fills the specified area, without distortion but possibly with some cropping, while maintaining the original aspect ratio of the application.

• "noScale": The entire application is fixed, so that it remains unchanged even as the size of the player window changes. Cropping might occur if the player window is smaller than the content.

Answer 2

The quickest thing I can think of is just setting the width to 100%. I've tested and it seems to work fine:

screenshot link

Lars has already posted all the available alternatives.

HTH, George

Answer 3

check inside your loaded swf code, if you are setting the stageScaleMode to noScale. That was the source of my problem.

Answer 4

As TestPlanManagement.com answered correctly, Jing videos cannot be scaled. But the SWF can be changed to allow this. See Resizing embedded screencasts with TechSmith Jing. The commercial Action Script Viewer is used to change the constant in the SWF.

Answer 5

You need to add some extra script like so:

function resizeFlashDiv()
{
        var theDiv = document.getElementById("navContainer");

        var theHeight = Math.floor(theDiv.offsetWidth * .33625) + 50; // add
the variable portion plus the fixed portion of the Flash

        theDiv.style.height = theHeight + "px";

}

This will make your SWF fill the DIV.