Как получить другие div с макетом флэш-жидкости, которая подходит к странице? - PullRequest
Новая
       13

Как получить другие div с макетом флэш-жидкости, которая подходит к странице?

0 голосов
/ 29 июня 2011

По большей части мой контент основан на флеш-памяти.Я разработал его с помощью Flash Builder (Flex) и It в жидкой компоновке (все в процентах), и если я ПРОСТО внедряю флэш-контент, он масштабируется до тонкой страницы, и у меня есть флэш-контент, настроенный с отступом 50гарнизонная лавка

Я поместил заголовочный div в порядке без проблем, но у меня есть 2 проблемы, первая из которых заключается в том, что div нижнего колонтитула, кажется, закрывает основание содержимого флэш-памяти в IE, но в chrome выглядит просто отлично.Как я могу решить это?Я использую стандартный код для встраивания, который предоставляет Flex, я попытался отредактировать стиль css для div, который я считаю #flashContent, и задать ему минимальную ширину и минимальную высоту, но, похоже, это не сработало, на самом деле все, что я сделал с #flashContent, кажется, ничего не делает, может быть, это не div, мне нужно добавить этот атрибут в ...

И другая моя проблема в том, что я даже не знаю, с чего начать, когда дело доходит до размещения divэто ширина 280 на 600 высот столбца с правой стороны содержимого флэш-памяти.Если бы я мог указать размер для содержимого флэш-памяти, и плавать его влево, и плавать столбец вправо, и очистить его с идентификатором div контейнера, все будет в порядке .... Но помните, что флэш-контент установлен на 100% Scale (ну технически 100% х80%, потому что так выглядело лучше).

Кто-нибудь знает, как я могу начать создавать более сложные масштабируемые макеты флеш-памяти, включающие другие элементы div?ВСЕ ХОРОШО ПОДДЕРЖИВАЕТЕ ПОДДЕРЖКУ IE?IE разрушает мою жизнь.

Вот код, который я использую:

(или, если это поможет вам визуализировать то, что я пытаюсь сделать, вот страница, где я работаю над настройкой этого http://apumpkinpatch.com/textmashnew/)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> 
    <head>
        <title>TextMixup</title>
        <meta name="google" value="notranslate">         
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
       <link href="css.css" rel="stylesheet" type="text/css" />
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
        <script src="../appassets/scripts/jquery.titlealert.js"></script>
        <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-19768131-2']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

function tabNotification()
          {  $.titleAlert('New Message!', {interval:200,requireBlur:true,stopOnFocus:true}); }
function joinNotification()
          {  $.titleAlert('Joined Chat!', {interval:200,requireBlur:true,stopOnFocus:true}); }

</script>
        <!-- BEGIN Browser History required section -->
        <link rel="stylesheet" type="text/css" href="history/history.css" />
        <script type="text/javascript" src="history/history.js"></script>
        <!-- END Browser History required section -->  

        <script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript">
            var swfVersionStr = "10.2.0";
            var xiSwfUrlStr = "playerProductInstall.swf";
            var flashvars = {};
            var params = {};
            params.quality = "high";
            params.bgcolor = "#ffffff";
            params.allowscriptaccess = "sameDomain";
            params.allowfullscreen = "true";
            var attributes = {};
            attributes.id = "TextMixup";
            attributes.name = "TextMixup";
            attributes.align = "middle";
            swfobject.embedSWF(
                "TextMixup.swf", "flashContent", 
                "100%", "80%", 
                swfVersionStr, xiSwfUrlStr, 
                flashvars, params, attributes);
            swfobject.createCSS("#flashContent", "display:block;text-align:left;");
        </script>
    </head>
    <body>
   <div id="homebar"><a href="http://apumpkinpatch.com"><img src="../appassets/images/logo/logoHor_130_30.png" alt="APumpkinPatch HOME" width="130" height="30" hspace="10" vspace="3" border="0"/></a>
       </div>
<div id="topad">
<script type="text/javascript"><!--
google_ad_client = "pub-5824388356626461";
/* 728x90, textmash */
google_ad_slot = "1114351240";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<div id="mainContainer">

        <div id="flashContent">
          <p>
                To view this page ensure that Adobe Flash Player version 
                10.2.0 or greater is installed. 
            </p>
            <script type="text/javascript"> 
                var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); 
                document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" 
                                + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); 
            </script> 
        </div>

        <noscript>
            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="80%" id="TextMixup">
                <param name="movie" value="TextMixup.swf" />
                <param name="quality" value="high" />
                <param name="bgcolor" value="#ffffff" />
                <param name="allowScriptAccess" value="sameDomain" />
                <param name="allowFullScreen" value="true" />
                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="TextMixup.swf" width="100%" height="80%">
                    <param name="quality" value="high" />
                    <param name="bgcolor" value="#ffffff" />
                    <param name="allowScriptAccess" value="sameDomain" />
                    <param name="allowFullScreen" value="true" />
                <!--<![endif]-->
                <!--[if gte IE 6]>-->
                    <p> 
                        Either scripts and active content are not permitted to run or Adobe Flash Player version
                        10.2.0 or greater is not installed.
                    </p>
                <!--<![endif]-->
                    <a href="http://www.adobe.com/go/getflashplayer">
                        <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>
        </noscript>
        <div id="convosPreview">This is a div I would want to appear as a colum to the right of the flash content that can scale</div>



        <!---End mainContainer -->
        </div>

    <div id="footer">
 <a href="../apps.html"><img src="../appassets/images/apps.png" hspace="5" vspace="5" alt="random chat app apumpkinpatch" width="228" height="40" border="0" /></a><a href="https://chrome.google.com/webstore/detail/hjmnobclpbhnjcpdnpdnkbgdkbfifbao?hl=en-US#"><img src="../appassets/images/chromeapp.png" alt="chrome app random video chat apumpkinpatch" width="115" height="40" vspace="5" border="0" /></a><br /><br />
<a href="http://spacebarup.com" target="_blank">©2011 Space Bar</a> | <a href="../tos.html">TOS & Privacy Policy</a> | <a href="../help.html">FAQ & Help</a> | <a href="../tips.html">Important online safety tips</a> | <a href="http://www.facebook.com/pages/APumpkinPatchcom/164279206963001?sk=app_2373072738" target="_blank">Discussion Boards</a><br />

                  <p>You must be at least 18 years of age to access this web site.<br />APumpkinPatch.com is not responsible for the actions of any visitors of this site.<br />APumpkinPatch.com does not endorse or claim ownership to any of the content that is broadcast through this site. </p><h2>A Pumpkin Patch is BRAND NEW and will be developed a lot over the next few months adding video chat games, chat rooms, and more! Check back often it's going to be a lot of fun!</h2>
 </div>  

</body>
</html>

myCSS: 

html, body  { 
    height:100%; 
}

body { 
    text-align:center;
    font-family: Helvetica, Arial, sans-serif;
    margin:0; 
    padding:0; 
    overflow:auto; 
    text-align:center; 
    background-color: #ffffff;
}   
object:focus { 
    outline:none;
}
#homebar {
    clear:both;
    text-align: left;
    width: 100%;
    height: 40px;
    background-color:#333333;
    color:#CCC;
    overflow:hidden;
    box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.65);
    -moz-box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.65);
    -webkit-box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.65);
    margin-bottom: 10px;
}
#mainContainer {
    height:auto;
    width:auto;
    clear:both;
}
#flashContent { 
    display:none;
    height:auto;
    float:left;
    min-height: 500px;
    min-width: 340px;
}
/**this is the div i want to appear as a column net to the scaleable flash content **/
#convosPreview {
    float:right;
    width:280px;
    height:600px;
}

1 Ответ

0 голосов
/ 29 июня 2011

Я считаю, что вам нужно удалить «float: left» из #flashcontent в CSS, поскольку float заставит его перейти на отдельный индексЯ также не уверен, почему у вас нет ни одной и минимальной высоты / ширины там.Во всяком случае, вам нужно добавить это в #mainContainer.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...