1 Reply Latest reply on Apr 26, 2011 9:53 AM by Henry Seng

    Embedded SWF 100% width and height

    Henry Seng Newbie

      Hi everyone,


      I've the task of embedding  a swf in a xhtml page with 100% width and height.


      I tried the code below but it works only with Chrome (10.0.648.205) and not with ie, firefox, opera (the swf starts to load but doesn't finish). Hope someone can help me find a solution.


      <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
          
          
      <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://jboss.com/products/seam/taglib" xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:rich="http://richfaces.org/rich"
        xmlns:a4j="http://richfaces.org/a4j" xmlns:c="http://java.sun.com/jstl/core" template="/layout/viewTemplate.xhtml">
        
          <ui:define name="side">
          <a4j:form ajaxSubmit="true" id="filterForm">
            <rich:spacer height="25px" />
      
            <c:forEach var="file" items="#{spaceTimeDiagram.xhtmlFiles}">
              <ui:include src="#{file}" />
            </c:forEach>
      
            <rich:spacer height="10px" width="100%" />
       
            <h:commandButton value="#{messages['impt.std.Apply']}" action="#{spaceTimeDiagram.applyFilters}" />
          </a4j:form>
        </ui:define>
      
        <ui:define name="body">
      
        <h:form id="spaceTimeDiagramForm">
      
            <a4j:queue ignoreDupResponses="true"></a4j:queue>
      
            <h1>#{messages['impt.std.title']}</h1>
      
            <rich:panel id="stdPanelId">
               <object >
                  <embed src="/im_pt/flex/STDiagram.swf" type="application/x-shockwave-flash" width="100%" height="100%" quality="high" wmode="transparent" />
               </object>
            </rich:panel>
      
          </h:form>
      
        </ui:define>
      </ui:composition>
      



      Seam version : 2.2.0.GA


      JBoss version : 5.1.0.GA


      Flex sdk : 4.1



      Regards,


      Henry

        • 1. Re: Embedded SWF 100% width and height
          Henry Seng Newbie

          tried another solution with javascript swfobject but like before, it only works with chrome :





          <!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              
              
          <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://jboss.com/products/seam/taglib" xmlns:ui="http://java.sun.com/jsf/facelets"
            xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:rich="http://richfaces.org/rich"
            xmlns:a4j="http://richfaces.org/a4j" xmlns:c="http://java.sun.com/jstl/core" template="/layout/viewTemplate.xhtml">
            
            <ui:define name="head">
            
            <script src="swfobject.js"></script>
           <script>
          var flashvars = {};
          var params = { scale: "exactFit" };
          var attributes = {};
          
          swfobject.embedSWF("/im_pt/flex/STDiagram.swf", "stdiagram", "100%", "100%", "9.0.0","expressInstall.swf", flashvars, params, attributes);
          </script></ui:define>
            
              <ui:define name="side">
              <a4j:form ajaxSubmit="true" id="filterForm">
                <rich:spacer height="25px" />
          
                <c:forEach var="file" items="#{spaceTimeDiagram.xhtmlFiles}">
                  <ui:include src="#{file}" />
                </c:forEach>
          
                <rich:spacer height="10px" width="100%" />
           
                <h:commandButton value="#{messages['impt.std.Apply']}" action="#{spaceTimeDiagram.applyFilters}" />
              </a4j:form>
            </ui:define>
          
            <ui:define name="body">
          
          
          
            <h:form id="spaceTimeDiagramForm">
          
                <a4j:queue ignoreDupResponses="true"></a4j:queue>
          
                <h1>#{messages['impt.std.title']}</h1>
                <rich:panel id="stdPanelId"> 
                    <div id="stdiagram">This div will be replaced by an object via SWFObject</div>
          
                    
                  
                      
                </rich:panel>
          
              </h:form>
          
            </ui:define>
          </ui:composition>