Reflow Screen Size

After designing a site in the regular view then switching to the preview mode, the default area is now larger and when I open up the webpage it is as if the larger of the default size takes over. Is there a way to make the default area the same as the area I can edit when the canvas zoom is at 100% ?

Reflow is built in html, css, and js so there's not an easy way to trick the browser to not apply the media queries for the current screen size. If it's just a little bit, like the different between preview and non-preview maybe you can temporarily make your last breakpoint small enough that you can see a little bit of the default region and see your page there. You could also maybe drag the reflow window partially off the edge of your computer screen then resize the the window wider to make it larger than your screen. Netiher of those are ideal but that only other things I could think of besides using zoom.
Hope that helps and thanks for using Reflow!
Chris

Similar Messages

  • Can Reflow change display tools based on changing screen sizes?

    I have a lenghty check list in a desktop-sized view, but want to change to a selection wheel type of display tool for a phone-sized screen.  Is there a way to make the display tool change, yet keep the same content simply by reducing down to the smaller screen size?
    Is it even possible to add a selection wheel type tool in Reflow?  If you don't know what I mean by "selection wheel" I've found this site that has a functioning example.  http://www.menuhead.com/example.php

    One way of having different content at different screen sizes is to have both elements on your page, and change the display of each of them to either "Block" or "None" depending on whether or not you want it to be displayed for that media query region.
    And no, we don't have a selection wheel element in Reflow. Your best bet there is probably to use a box to represent it in Reflow, and then replace it with the desired element using Dreamweaver, Brackets, or whatever other tool you use next in your workflow.
    Hope that helps, and thanks for using Reflow!
    Vic

  • Edge reflow limited screen size

    It appears that Reflow limits the horizontal screen size to 1,000 pixels wide. Dreamweaver fuild grid for computer screen is 1232 wide. Is it possible for Reflow to size up to that screen size or more?

    The screen size shouldn't be limited. There's even a zoom control if you need to use a screen wider than your monitor:
    Hope that helps and thanks for using Reflow!
    Chris

  • How do you open a project started in Muse, Dreamweaver, or other to tweak for different screen sizes

    How do you open a project started in Muse, Dreamweaver, or other design program to tweak for different screen sizes?

    Hi. As of now HTML import is not plan of record for Reflow 1.0.  See this FAQ for a bit more info - http://forums.adobe.com/message/5071510#5071510.
    -C

  • Satellite A300 PSAG0A - Games Will Not Display in Full Screen Size

    I have a large number of games installed on my computer. At least 90% of them will not display in full screen size but display in a small window with a large amount of black screen surrounding the window. I am running Windows Vista Home Premium 32 bit. However, I do not think it has anything to do with Windows as my husband runs the same games on his Toshiba Satellite L300, running exactly the same version of windows, and they all display in full screen size.
    Altering the screen resolution makes no difference. And, of course, I do select the full screen option in the games.
    Also, sometimes when I have been playing a game and then closed it I find that my desktop picture has shrunk to the smaller size - the same size as the window in which the game was displayed when I was playing it.
    The games work fine in every other way, it is only this small screen size which is driving me nuts.
    I hope that someone can help me with this!!

    Yes, as far as I can tell I have the latest driver. But, even this is confusing to me because....
    My graphics media accelerator is Mobile Intel(R) 965 Express Chipset Family. The installed driver version is 7.14.10.1329. The release date for this is 2007-09-13, as far as I can tell from web searches.
    However, on the Toshiba website for driver downloads, the available driver version is 8.2.0.1012 PV. The date is 2006-12-28. I have downloaded this driver and attempted to install it. I get the message that it has been installed but, after rebooting and checking the installed driver version is still 7.14.10.1329.
    Perhaps, the 8.2.0.1012 PV version does not actually install because it is older than the currently installed version. I would have thought that the driver version with the higher number would be the newer one, but perhaps this is not the case as the dates do not seem to support this theory.
    So now I ask myself, firstly, if the driver available for download on the Toshiba website is not the newest one, then why is it there?
    Secondly, if it is the newest one then why will it not install on my computer?

  • IBook 14" to MacBook 13" screen size

    I am moving from a 14" iBook to the 13" widescreen MacBook. How do the two compare? Does the widescreen make up for the smaller overall screen size. I don't want to downgrade on size, as the 14" iBook is barely large enough.
    The computer is used for basic Word, Excel, Internet, email, but lots of screens open at the same time.
    Will it be OK???
    FB

    I made th exact same upgrade and initially shared your concerns, however I can say confidently that they were wholely un-founded. The higher resolution screen of the macbook provides more screen space in a smaller area than did the ibook. The biggest difference for me was the brightness though, soo much brighter than the ibook; I hardly ever turn it up past half way!
    The other posters are correct about expose though, I find i an invaluable tool. I also make use of virtuedesktops:
    http://virtuedesktops.info/
    It works perfectly to give you more useable screen area.

  • I use iwires to connect macbook to lg tv to watch netflix.How do I increase screen size on tv.I have tried display options on settings- not working

    I use iwires to connect macbook to lg tv to watch netflix.How do you increase screen size on rv.I have tried display settings ,but not working

    I would guess that the HDMI port on your mac is for output only - no input, and that's what your'e attempting to do when you attach the mac to your xbox. I looked in Mactracker and it lists the HDMI port as video output for both the 13" Retina MacBook Pro and the 15" Retina MacBook Pro (your post didn't say which one you have), so looks like that is the issue..

  • The green button, top left corner of a pop-up screen on MACbook, it's supposed to enlarge the pop-up to full MAC screen size, correct?  Mine does not.  Sometimes it makes the pop-up screen SMALLER.  Appreciate someone solving this for me.

    the green button, top left corner of a pop-up screen on MACbook, it's supposed to enlarge the pop-up to full MAC screen size, correct?  Mine does not.  Sometimes it makes the pop-up screen SMALLER.  Appreciate someone solving this for me.

    Are you talking about the green '+' button in the top left corner? That technically doesn't enlarge it. It switches the window from the default window size to the custom size you made. You can enlarge the window by moving your mouse to the bottom right corner of the window, and dragging until you get the size you want.
              MacBook

  • Mirroring with apple tv screen size on projector issue

    Hello, my name is Dave. I do praise and worship music at a small church.
    I want to mirror my ipad on a projection TV. I have the ipad and apple tv but it's not using the entire projection screen. It only uses about 40% of the screen.
    I also want to use portrait mode as landscape is to wide and won't display the entire song well.
    Apple suggested keynotes but I understand that doesn't work in portrait mode. That is a biggie for me. I have notability but isthe problem the app or getting the right screen resolution ont he projector / apple tv or how can I fix this please?
    Thanks,
    Dave

    Well that's the issue my friend. I called apple and told them what I wanted to do. They told me to get those things. So ... I called abck and double checked. I asked a different person the same scenario. Same ereply. So yes I did order apple tv and airpolay. As stated it doesn't work. The image is WAY smaller than the screen and it's not scaleable at all.
    I don't understand what the praying jab is about. Praying was never mentioned in the issue here was it?
    Back to the issue: it's not that I didn't realize this technology isn't here I was told it was by two different techs. So when I called back to explain my problem I was bounced around apple to several departments to find the technology simply wasn't here yet as I was told. I was informed incorrectly. So appple let me return the products. The customer service person apologized and I certainly accepted.
    So the issue has nothing to do with praying etc. it's simply that for some reason, using your ipad for a demo only nets you 40% of the screen size and scaling is not an option.
    Wish I knew that before I placed the order as that was not how it was explained either time I called in.
    Now, let's have some techs start working on this issue... else I'm about to start praying... ;-)
    Dave

  • How do I set the screen size of my site?

    Hey guys making a site for a friend and I'm not sure on how I go about setting a screen size that can be viewed on varying screen sizes like 1280x800 and up. At the moment on my 1920x1080 display it looks fine but when I open it on her MacBook Pro (1280x800) it is cut of by half and my website has some fixed anchors which I do not allow scrolling so you are kind of stuck.
    Thanks to anyone that can help, can't find a tutorial anywhere

    In the normal state the screen on an iPad will rotate depending on which side is up. Any of the four sides can be up or on top and the display will look correct. But if you want to lock the display in one orientation you can. Swipe up from the bottom of the screen to reveal the Control Center. Then tap on the Orientation Lock icon. That's the icon of the small padlock surrounded by a circular arrow. That icon will appear at the top right of the display and the screen will no longer rotate. Repeat the same procedure to unlock orientation.

  • How do i make this page adapt to all screen sizes???

    if i copy and paste my index code can someone please tell me if theres anything i can add so it will adapt to all screen sizes??
    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Nicola Campbell Photography</title>
    <style type="text/css">
    #apDiv1 {
              position:absolute;
              width:1001px;
              height:170px;
              z-index:1;
              left: 438px;
              top: 221px;
    #navbar {
              height: 40px;
              width: 900px;
              margin-right: auto;
              margin-left: auto;
              border-top-style: none;
              border-right-style: none;
              border-bottom-style: none;
              border-left-style: none;
    </style>
    <script src="js/modernizr-2.5.2-respond-1.1.0.min.js" type="text/javascript"></script>
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.flexslider-min.js" type="text/javascript"></script>
    <script src="js/jquery.mousewheel.js" type="text/javascript"></script>
    <script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    <link href="css/flexslider.css" rel="stylesheet" type="text/css" />
    <script type="text/xml">
    <!--
    <oa:widgets>
      <oa:widget wid="2827522" binding="#OAWidget" />
    </oa:widgets>
    -->
    </script>
    <style type="text/css">
    #apDiv2 {
              position:absolute;
              width:901px;
              height:49px;
              z-index:2;
              left: 487px;
              top: 51px;
              text-align: center;
              color: #FF99FF;
              font-size: 80px;
              font-family: HaloHandletter;
    #apDiv3 {
              position:absolute;
              width:409px;
              height:56px;
              z-index:3;
              left: 768px;
              top: 96px;
              color: #999999;
              font-family: "Adobe Garamond Pro";
              font-size: 24px;
    #apDiv2 div {
              font-size: 100px;
              font-family: HaloHandletter;
              color: #999999;
    #apDiv4 {
              position:absolute;
              width:901px;
              height:449px;
              z-index:4;
              left: 451px;
              top: 202px;
    #apDiv5 {
              position:absolute;
              width:848px;
              height:152px;
              z-index:11;
              left: 433px;
              top: 201px;
    #apDiv6 {
              position:absolute;
              width:200px;
              height:115px;
              z-index:5;
              left: 1250px;
              top: 138px;
    #apDiv7 {
              position: absolute;
              width: 891px;
              height: 42px;
              z-index: 5;
              left: 552px;
              top: 174px;
    #apDiv8 {
              position:absolute;
              width:48px;
              height:50px;
              z-index:6;
              left: 102px;
              top: 51px;
    #apDiv9 {
              position:absolute;
              width:49px;
              height:51px;
              z-index:7;
              left: 152px;
              top: 51px;
    #apDiv10 {
              position:absolute;
              width:49px;
              height:49px;
              z-index:8;
              left: 202px;
              top: 51px;
    #apDiv11 {
              position:absolute;
              width:52px;
              height:52px;
              z-index:9;
              left: 252px;
              top: 51px;
    </style>
    <script type="text/javascript">
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    <meta name="Description" content="Welcome to Nicola Campbell Photography. I am based in Lancashire and specialise in Wedding Photography." />
    <meta name="viewport" content="width=device-width" />
    <link href="untitled.css" rel="stylesheet" type="text/css" />
    <!-- Phone -->
    <link href="iphone.css" rel="stylesheet" type="text/css" media="only screen and (max-width:320px)" />
    <!-- Tablet -->
    <link href="ipad.css" rel="stylesheet" type="text/css" media="only screen and (min-width:321px) and (max-width:768px)" />
    <!-- Desktop -->
    <link href="desktop.css" rel="stylesheet" type="text/css" media="only screen and (min-width:769px)" />
    <style type="text/css">
    #apDiv12 {
              position:absolute;
              width:1013px;
              height:648px;
              z-index:1;
              left: 321px;
              top: 299px;
    </style>
    </head>
    <body onload="MM_preloadImages('navbaroriginalroll_r1_c1.jpg','navbaroriginalroll_r1_c2.jpg','n avbaroriginalroll_r1_c5.jpg','navbaroriginalroll_r1_c6.jpg','navbaroriginalroll_r1_c7.jpg' ,'navbaroriginalroll_r1_c8.jpg','navbar_r1_c4.jpg')">
    <div id="apDiv2">
      <div align="center">nicola campbell</div>
    </div>
    <div id="apDiv3">P H O T O G R A P H Y</div>
    <div id="apDiv7"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('navbar','','navbaroriginalroll_r1_c1.jpg',1)"><img src="navbaroriginal_r1_c1.jpg" alt="c1" name="navbar" width="111" height="40" border="0" id="navbar2" /></a><a href="Aboutme.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','navbaroriginalroll_r1_c2.jpg',1)"><img src="navbaroriginal_r1_c2.jpg" name="Image13" width="111" height="40" border="0" id="Image13" /></a><a href="Gallery.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image21','','navbaroriginalroll_r1_c5.jpg',1)"><img src="navbaroriginal_r1_c5.jpg" alt="c5" name="Image21" width="111" height="40" border="0" id="Image21" /></a><a href="Blog.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image22','','navbaroriginalroll_r1_c6.jpg',1)"><img src="navbaroriginal_r1_c6.jpg" alt="c6" name="Image22" width="111" height="40" border="0" id="Image22" /></a><a href="ContactMe.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image23','','navbaroriginalroll_r1_c7.jpg',1)"><img src="navbaroriginal_r1_c7.jpg" alt="c7" name="Image23" width="111" height="40" border="0" id="Image23" /></a><a href="Clients.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image24','','navbaroriginalroll_r1_c8.jpg',1)"><img src="navbaroriginal_r1_c8.jpg" alt="c8" name="Image24" width="111" height="40" border="0" id="Image24" /></a><a href="Weddings.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image25','','navbar_r1_c4.jpg',1)"><img src="navbar_r1_c41.jpg" alt="" name="Image25" width="111" height="40" border="0" id="Image25" /></a></div>
    <div id="apDiv5">
      <script type="text/javascript">
    // BeginOAWidget_Instance_2827522: #OAWidget
    $(window).load(function() {
          $('#slider').flexslider({
                  namespace: "flex-",             //{NEW} String: Prefix string attached to the class of every element generated by the plugin
        selector: ".slides > li",       //{NEW} Selector: Must match a simple pattern. '{container} > {slide}' -- Ignore pattern at your own peril
          animation: "slide",
                 easing: "swing",               //{NEW} String: Determines the easing method used in jQuery transitions. jQuery easing plugin is supported!
          direction: "horizontal",   //String: Select the sliding direction, 'horizontal' or 'vertical'
        reverse: false,                 //{NEW} Boolean: Reverse the animation direction
        animationLoop: false,             //Boolean: Should the animation loop? If false, directionNav will received "disable" classes at either end
        smoothHeight: true,            //{NEW} Boolean: Allow height of the slider to animate smoothly in horizontal mode  
          slideshow: true,                //Boolean: Animate slider automatically
          slideshowSpeed: 5000,           //Integer: Set the speed of the slideshow cycling, in milliseconds
          animationSpeed: 600,         //Integer: Set the speed of animations, in milliseconds 
          initDelay: 0,                   //{NEW} Integer: Set an initialization delay, in milliseconds
          randomize: false,               //Boolean: Randomize slide order
                 useCSS: true,                   //{NEW} Boolean: Slider will use CSS3 transitions if available
          touch: true,                    //{NEW} Boolean: Allow touch swipe navigation of the slider on touch-enabled devices
           video: false,                   //{NEW} Boolean: If using video in the slider, will prevent CSS3 3D Transforms to avoid graphical glitches
          directionNav: true,             //Boolean: Create navigation for previous/next navigation? (true/false)
          controlNav: true,               //Boolean: Create navigation for paging control of each clide? Note: Leave true for manualControls usage
          keyboard: true,              //Boolean: Allow slider navigating via keyboard left/right keys
          mousewheel: false,              //Boolean: Allow slider navigating via mousewheel
          prevText: "Previous",           //String: Set the text for the "previous" directionNav item
          nextText: "Next",               //String: Set the text for the "next" directionNav item
          pausePlay: false,               //Boolean: Create pause/play dynamic element
          pauseText: "Pause",             //String: Set the text for the "pause" pausePlay item
          playText: "Play",               //String: Set the text for the "play" pausePlay item
          startAt: 0,                //Integer: The slide that the slider should start on. Array notation (0 = first slide)
          pauseOnAction: true,            //Boolean: Pause the slideshow when interacting with control elements, highly recommended.
          pauseOnHover: true,            //Boolean: Pause the slideshow when hovering over slider, then resume when no longer hovering    
          start: function(){},            //Callback: function(slider) - Fires when the slider loads the first slide
                controlsContainer: "",          //Selector: Declare which container the navigation elements should be appended too. Default container is the flexSlider element. Example use would be ".flexslider-container", "#container", etc. If the given element is                                                             not found, the default action will be taken.
           manualControls: "",             //Selector: Declare custom control navigation. Example would be ".flex-control-nav li" or "#tabs-nav li img", etc. The number of elements in your controlNav should match the number of slides/tabs.
           // Carousel Options
        itemWidth: 0,                   //{NEW} Integer: Box-model width of individual carousel items, including horizontal borders and padding.
        itemMargin: 10,                  //{NEW} Integer: Margin between carousel items.
        minItems: 0,                    //{NEW} Integer: Minimum number of carousel items that should be visible. Items will resize fluidly when below this.
        maxItems: 0,                    //{NEW} Integer: Maxmimum number of carousel items that should be visible. Items will resize fluidly when above this limit.
        move: 0,                        //{NEW} Integer: Number of carousel items that should move on animation. If 0, slider will move all visible items.
                before: function(){},           //Callback: function(slider) - Fires asynchronously with each slider animation
          after: function(){},            //Callback: function(slider) - Fires after each slider animation completes
          end: function(){}               //Callback: function(slider) - Fires when the slider reaches the last slide (asynchronous)
    // EndOAWidget_Instance_2827522
      </script><!-- #main-container -->
      <script type="text/javascript">
    // BeginOAWidget_Instance_2827522: #OAWidget
    $(window).load(function() {
          $('#slider').flexslider({
                  namespace: "flex-",             //{NEW} String: Prefix string attached to the class of every element generated by the plugin
        selector: ".slides > li",       //{NEW} Selector: Must match a simple pattern. '{container} > {slide}' -- Ignore pattern at your own peril
          animation: "slide",
                 easing: "swing",               //{NEW} String: Determines the easing method used in jQuery transitions. jQuery easing plugin is supported!
          direction: "horizontal",   //String: Select the sliding direction, 'horizontal' or 'vertical'
        reverse: false,                 //{NEW} Boolean: Reverse the animation direction
        animationLoop: false,             //Boolean: Should the animation loop? If false, directionNav will received "disable" classes at either end
        smoothHeight: true,            //{NEW} Boolean: Allow height of the slider to animate smoothly in horizontal mode  
          slideshow: true,                //Boolean: Animate slider automatically
          slideshowSpeed: 5000,           //Integer: Set the speed of the slideshow cycling, in milliseconds
          animationSpeed: 600,         //Integer: Set the speed of animations, in milliseconds 
          initDelay: 0,                   //{NEW} Integer: Set an initialization delay, in milliseconds
          randomize: false,               //Boolean: Randomize slide order
                 useCSS: true,                   //{NEW} Boolean: Slider will use CSS3 transitions if available
          touch: true,                    //{NEW} Boolean: Allow touch swipe navigation of the slider on touch-enabled devices
           video: false,                   //{NEW} Boolean: If using video in the slider, will prevent CSS3 3D Transforms to avoid graphical glitches
          directionNav: true,             //Boolean: Create navigation for previous/next navigation? (true/false)
          controlNav: true,               //Boolean: Create navigation for paging control of each clide? Note: Leave true for manualControls usage
          keyboard: true,              //Boolean: Allow slider navigating via keyboard left/right keys
          mousewheel: false,              //Boolean: Allow slider navigating via mousewheel
          prevText: "Previous",           //String: Set the text for the "previous" directionNav item
          nextText: "Next",               //String: Set the text for the "next" directionNav item
          pausePlay: false,               //Boolean: Create pause/play dynamic element
          pauseText: "Pause",             //String: Set the text for the "pause" pausePlay item
          playText: "Play",               //String: Set the text for the "play" pausePlay item
          startAt: 0,                //Integer: The slide that the slider should start on. Array notation (0 = first slide)
          pauseOnAction: true,            //Boolean: Pause the slideshow when interacting with control elements, highly recommended.
          pauseOnHover: true,            //Boolean: Pause the slideshow when hovering over slider, then resume when no longer hovering    
          start: function(){},            //Callback: function(slider) - Fires when the slider loads the first slide
                controlsContainer: "",          //Selector: Declare which container the navigation elements should be appended too. Default container is the flexSlider element. Example use would be ".flexslider-container", "#container", etc. If the given element is                                                             not found, the default action will be taken.
           manualControls: "",             //Selector: Declare custom control navigation. Example would be ".flex-control-nav li" or "#tabs-nav li img", etc. The number of elements in your controlNav should match the number of slides/tabs.
           // Carousel Options
        itemWidth: 0,                   //{NEW} Integer: Box-model width of individual carousel items, including horizontal borders and padding.
        itemMargin: 0,                  //{NEW} Integer: Margin between carousel items.
        minItems: 0,                    //{NEW} Integer: Minimum number of carousel items that should be visible. Items will resize fluidly when below this.
        maxItems: 0,                    //{NEW} Integer: Maxmimum number of carousel items that should be visible. Items will resize fluidly when above this limit.
        move: 0,                        //{NEW} Integer: Number of carousel items that should move on animation. If 0, slider will move all visible items.
                before: function(){},           //Callback: function(slider) - Fires asynchronously with each slider animation
          after: function(){},            //Callback: function(slider) - Fires after each slider animation completes
          end: function(){}               //Callback: function(slider) - Fires when the slider reaches the last slide (asynchronous)
    // EndOAWidget_Instance_2827522
      </script>
      <div id="main-container">
        <p> </p>
        <div id="main" class="wrapper clearfix">
          <!-- FlexSlider -->
          <div id="container">
            <div id="slider" class="flexslider">
              <ul class="slides">
                <li> <img src="hollie.jpg" width="500" height="600" /> </li>
                <li> <img src="slider2.jpg" width="500" height="600" /> </li>
                <li> <img src="slider3.jpg" width="500" height="600" /> </li>
                <li> <img src="slider8.jpg" width="500" height="600" /> </li>
                <li> <img src="slider4.jpg" width="500" height="600" /> </li>
                <li> <img src="slider5.jpg" width="500" height="600" /> </li>
                <li> <img src="slider6.jpg" width="500" height="600" /> </li>
                <li> <img src="slider1.jpg" width="500" height="600" /> </li>
              </ul>
            </div>
            <div id="carousel" class="flexslider" style="display:none;">
              <ul class="slides">
                <li> <img src="hollie.jpg" width="500" height="600" /> </li>
                <li> <img src="slider2.jpg" width="500" height="600" /> </li>
                <li> <img src="slider3.jpg" width="500" height="600" /> </li>
                <li> <img src="slider8.jpg" width="500" height="600" /> </li>
                <li> <img src="slider4.jpg" width="500" height="600" /> </li>
                <li> <img src="slider5.jpg" width="500" height="600" /> </li>
                <li> <img src="slider6.jpg" width="500" height="600" /> </li>
                <li> <img src="slider1.jpg" width="500" height="600" /> </li>
              </ul>
            </div>
          </div>
        </div>
        <!-- #main -->
      </div>
      <!-- #main-container -->
    </div>
    <!-- #main-container -->
    <div id="apDiv8"><a href="https://www.facebook.com/nicola.shulmancampbell?fref=ts"><img src="Retro-Facebok-Rounded-128.png" width="48" height="48" /></a></div>
    <div id="apDiv9"><img src="Retro-Flickr-Rounded-128.png" width="48" height="48" /></div>
    <div id="apDiv10"><img src="Retro-Tumblr-Rounded-128.png" width="48" height="48" /></div>
    <div id="apDiv11"><a href="https://twitter.com/nicola_shulman"><img src="Retro-Twitter-Rounded-128.png" width="48" height="48" /></a></div>
    <script type="text/javascript">
    $(window).load(function() {
          $('#slider').flexslider({
                  namespace: "flex-",             //{NEW} String: Prefix string attached to the class of every element generated by the plugin
        selector: ".slides > li",       //{NEW} Selector: Must match a simple pattern. '{container} > {slide}' -- Ignore pattern at your own peril
          animation: "slide",
                 easing: "swing",               //{NEW} String: Determines the easing method used in jQuery transitions. jQuery easing plugin is supported!
          direction: "horizontal",   //String: Select the sliding direction, 'horizontal' or 'vertical'
        reverse: false,                 //{NEW} Boolean: Reverse the animation direction
        animationLoop: false,             //Boolean: Should the animation loop? If false, directionNav will received "disable" classes at either end
        smoothHeight: true,            //{NEW} Boolean: Allow height of the slider to animate smoothly in horizontal mode  
          slideshow: true,                //Boolean: Animate slider automatically
          slideshowSpeed: 5000,           //Integer: Set the speed of the slideshow cycling, in milliseconds
          animationSpeed: 600,         //Integer: Set the speed of animations, in milliseconds 
          initDelay: 0,                   //{NEW} Integer: Set an initialization delay, in milliseconds
          randomize: false,               //Boolean: Randomize slide order
                 useCSS: true,                   //{NEW} Boolean: Slider will use CSS3 transitions if available
          touch: true,                    //{NEW} Boolean: Allow touch swipe navigation of the slider on touch-enabled devices
           video: false,                   //{NEW} Boolean: If using video in the slider, will prevent CSS3 3D Transforms to avoid graphical glitches
          directionNav: true,             //Boolean: Create navigation for previous/next navigation? (true/false)
          controlNav: true,               //Boolean: Create navigation for paging control of each clide? Note: Leave true for manualControls usage
          keyboard: true,              //Boolean: Allow slider navigating via keyboard left/right keys
          mousewheel: false,              //Boolean: Allow slider navigating via mousewheel
          prevText: "Previous",           //String: Set the text for the "previous" directionNav item
          nextText: "Next",               //String: Set the text for the "next" directionNav item
          pausePlay: false,               //Boolean: Create pause/play dynamic element
          pauseText: "Pause",             //String: Set the text for the "pause" pausePlay item
          playText: "Play",               //String: Set the text for the "play" pausePlay item
          startAt: 0,                //Integer: The slide that the slider should start on. Array notation (0 = first slide)
          pauseOnAction: true,            //Boolean: Pause the slideshow when interacting with control elements, highly recommended.
          pauseOnHover: true,            //Boolean: Pause the slideshow when hovering over slider, then resume when no longer hovering    
          start: function(){},            //Callback: function(slider) - Fires when the slider loads the first slide
                controlsContainer: "",          //Selector: Declare which container the navigation elements should be appended too. Default container is the flexSlider element. Example use would be ".flexslider-container", "#container", etc. If the given element is                                                             not found, the default action will be taken.
           manualControls: "",             //Selector: Declare custom control navigation. Example would be ".flex-control-nav li" or "#tabs-nav li img", etc. The number of elements in your controlNav should match the number of slides/tabs.
           // Carousel Options
        itemWidth: 0,                   //{NEW} Integer: Box-model width of individual carousel items, including horizontal borders and padding.
        itemMargin: 10,                  //{NEW} Integer: Margin between carousel items.
        minItems: 0,                    //{NEW} Integer: Minimum number of carousel items that should be visible. Items will resize fluidly when below this.
        maxItems: 0,                    //{NEW} Integer: Maxmimum number of carousel items that should be visible. Items will resize fluidly when above this limit.
        move: 0,                        //{NEW} Integer: Number of carousel items that should move on animation. If 0, slider will move all visible items.
                before: function(){},           //Callback: function(slider) - Fires asynchronously with each slider animation
          after: function(){},            //Callback: function(slider) - Fires after each slider animation completes
          end: function(){}               //Callback: function(slider) - Fires when the slider reaches the last slide (asynchronous)
    // EndOAWidget_Instance_2827522
    </script>
    </body>
    </html>

    APDivs cannot be resized. 
    APDivs in primary layouts won't work in Responsive Web Design. 
    APDivs are a very poor layout method. 
    For this reason, Adobe removed APDivs from Dreamweaver CC.
    Example of Fluid Grid Layout with floats & margins, no APDivs required.
    http://alt-web.com/FluidGrid/Fluid2.html
    Nancy O.

  • How can I get my movie clip to resize according to screen size?

    I have a movie clip (startMenu); inside it there are buttons, text, and graphics. This is a game I am making, and it will be played on different screen sizes of Android. This is the code I have so far:
    stage.scaleMode = StageScaleMode.NO_SCALE;
    stage.align = StageAlign.TOP_LEFT
    startMenu.addEventListener(Event.RESIZE, resizeLayout);
    function resizeLayout(e:Event):void
        setPosition();
    function setPosition():void
         startMenu.x = (stage.stageWidth - startMenu.width) / 2;
            startMenu.y = (stage.stageHeight - startMenu.height) /2;
    When I run it on different phones using debugging, it locks on the left hand corner, but does stretch out to fit the whole screen. What should I do?

    try changing
    stage.scaleMode = StageScaleMode.NO_SCALE;
    to
    stage.scaleMode = StageScaleMode.EXACT_FIT;
    http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/StageScal eMode.html

  • How can I find out the screen size of the users moniter using the Acrobat SDK?

    How can I find out the screen size of the users moniter using the Acrobat SDK? I need to know how much sreen real estate that is available on the users moniter. Is there some call that I can make from the SDK to discover the maximun X and Y coordinates?
    Thanks,
    Gregory

    Currently, I am testing on multiple moniters and it is defaulting to the moniter designated as the #1 moniter. For our purposes, this is acceptable. Once the two documents have loaded, the user can move and re-size at will.
    Gregory

  • With ios 7.03 I cannot expand youtube videos to screen size but get white blanks all around the stream

    since the update to ios 7.0.3 I cannot expand Youtube videos to screen size - instead, the features around the video dissappear and are replaced by white fields. With my ipad mini I do not have that problem.
    Does anybody know advice?

    Reset the device:
    Press and hold the Sleep/Wake button and the Home button together for at least ten seconds, until the Apple logo appears.
    If that doesn't help, tap Settings > General > Reset > Reset All Settings

  • Best practice for setting or detecting screen size?

    Hi All,
    Trying to determine a best practice for setting or detecting the screen size. For playbook and iOS, I can set them. But for Android, the number of devices is too large so I'd rather detect. My first choice is to use the stage.stageHeight and stage.stageWidth. This works fine if I set my stage properties with standard meta data:
    [SWF(height="320", width="480", frameRate="64", backgroundColor="#010101")]
    However, if I use the application descriptor file to set the stage dimentions (as suggested by Christian Cantrell here http://www.adobe.com/devnet/flash/articles/authoring_for_multiple_screen_sizes.html)
    <initialWindow>
    <aspectRatio>landscape</aspectRatio>
    <autoOrients>false</autoOrients>
    <width>320</width>
    <height>480</height>
    <fullScreen>true</fullScreen>
    </initialWindow>
    Then the stage.stageHeight and stage.stageWidth are not the correct numbers when my main class is added to the stage. Sometime after the main class is added to the stage, then those numbers are fine. Is there an event I can wait for to know that the stage.stageHeight and stage.stageWidth are correct?
    Thanks in advance!

    Hi Lee,
    Thanks for the quick response! However, for some reason the heightPercent & widthPercent metadata tags are not working as expected for me.
    I have a wrapper class that I target for compiling, WagErgApplePhone.as where I've got my metadata
    [SWF(heightPercent="100%", widthPercent="100%", frameRate="64", backgroundColor="#010101")]
    sets some stage properties
    stage.quality=StageQuality.LOW;
    stage.scaleMode = StageScaleMode.NO_SCALE;
    stage.align = StageAlign.TOP_LEFT;
    and instantiates my main class
    var main:Main = new Main();
    addChild(main);
    my main class constructor even waits for the stage
    public function Main(){
    if (stage) init();
    else addEventListener(Event.ADDED_TO_STAGE, init);
    in my init function, stage.stageHeight traces out as 375 (expecting 320).
    i have a function which is called via a button press event by the user, and stage.stageHeight traces out correctly (320) there. that's what makes me think that if i wait long enough, i can get the correct stageHeight before init/drawing. but i'm not sure what event to listen for, or if there's another trick.
    if i use Capabilities.screenResolutionX and Capabilities.screenResolutionY the correct values are provided for mobile, but these values are not useful for the desktop and web version of the app. if there's no other solution, i'll execute different code depending on platform.
    again, for reference, my app descriptor:
    <initialWindow>
    <aspectRatio>landscape</aspectRatio>
    <autoOrients>false</autoOrients>
    <width>320</width>
    <height>480</height>
    <content>bin-iOS/WagErgApplePhone.swf</content>
    <title>WAG ERG</title>
    <fullScreen>true</fullScreen>
    <renderMode>cpu</renderMode>
    </initialWindow>
    looking forward to any other ideas to try out & thanks so much for your thoughts! if you want to really dig in, this is an opensource project at code.google.com/p/wag-erg/

Maybe you are looking for