jQuery UI Widgets Forums Dialogs and Notifications Window Window resize issue

Tagged: 

This topic contains 3 replies, has 2 voices, and was last updated by  Mhanna AbuTareef 7 years, 11 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • Window resize issue #22864

    Mhanna AbuTareef
    Participant

    Hi,

    While using scroll view inside a window’s content, it’s impossible to set window’s width to value greater than 800. why?

    Regards,

    Mhanna

    Window resize issue #22868

    Mhanna AbuTareef
    Participant

    Hi,

    Follow is a sample which demonstrates the issue of the previous post

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta name="keywords" content="jQuery ScrollView, ScrollView Widget, ScrollView, Mobile ScrollView" />
    <meta name="description" content="jqxScrollView represents a widget which can be used for viewing content which is wider than the visible area outlined by the device's screen. Specific item can be chosen using drag movements or clicking/tapping on the buttons at the bottom of the jqxScrollView." />
    <title id="Description">jqxScrollView represents a widget which can be used for viewing content which is wider than the visible area outlined by the device's screen. Specific item can be chosen using drag movements or clicking/tapping on the buttons at the bottom of the jqxScrollView.</title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css"/>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.classic.css" />
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollview.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
    <script type="text/javascript">
    $(function () {
    var theme = getDemoTheme();
    $('#customWindow').jqxWindow({ width: 1000, height: 450, theme: theme});
    $('#photoGallery').jqxScrollView({ width: 1000, height: 450, buttonsOffset: [0, 0], theme: theme });
    $('#StartBtn').jqxButton({ theme: theme });
    $('#StopBtn').jqxButton({ theme: theme });
    $('#StartBtn').click(function () {
    $('#photoGallery').jqxScrollView({ slideShow: true });
    });
    $('#StopBtn').click(function () {
    $('#photoGallery').jqxScrollView({ slideShow: false });
    });
    });
    </script>
    <style type="text/css">
    .photo
    {
    width: 600px;
    height: 450px;
    background-color: #000;
    background-position: center;
    background-repeat: no-repeat;
    }
    </style>
    </head>
    <body class="default">
    <div id="customWindow">
    <div id="customWindowHeader">
    Window
    </div>
    <div id="customWindowContent" style="overflow: hidden">
    <div id="photoGallery">
    <div><div class="photo" style="background-image: url(../../images/imageNature1.jpg)"></div></div>
    <div><div class="photo" style="background-image: url(../../images/imageNature2.jpg)"></div></div>
    <div><div class="photo" style="background-image: url(../../images/imageNature3.jpg)"></div></div>
    <div><div class="photo" style="background-image: url(../../images/imageNature4.jpg)"></div></div>
    <div><div class="photo" style="background-image: url(../../images/imageNature5.jpg)"></div></div>
    </div>
    </div>
    </div>
    <div style='margin-top: 20px;'>
    <br />
    <div>
    <input type="button" value="Start Slideshow" id="StartBtn" />
    <input type="button" value="Stop Slideshow" id="StopBtn" />
    </div>
    </div>
    </body>
    </html>
    Window resize issue #22972

    Peter Stoev
    Keymaster

    Hi,

    Actually that is how the widget is supposed to work. The maxWidth and maxHeight properties restrict the Resizing of the widget. You need to set these, too if you wish to resize a window above width=800px and height=600px.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    Window resize issue #23042

    Mhanna AbuTareef
    Participant

    Hi,

    Already using maxWidth and maxHeight limitations. but the real problem was because i used integer values in the dimensions.
    when i changed it to string (with suffix ‘px’), it works!

    Anyway, it looks that minWidth can’t be instring format, for Instance, the following code generates an error:

    $('#customWindow').jqxWindow({ width: "600px", height: "400px", maxWidth: "1000px", minWidth: "300px", maxHeight: "500px", minHeight: "200px", theme: theme});

    Regards,

    Mhanna

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.