jQWidgets Forums

This topic contains 1 reply, has 2 voices, and was last updated by Dimitar 11 years, 12 months ago.

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

Author

Window full screen effect Posts

March 25, 2013 at 3:17 pm Window full screen effect #17967

vmanne

Participant

Is there anyway to make the jqxWindow open in full screen? I’m working on showing the map in the window and would like to have it opened in full screen when a button is pressed and close when esc button is used.

Here’s my code I’m using to pop up the map

$(document).ready(function () {
$(‘#window’).jqxWindow({
animationType: ‘slide’,
showCollapseButton: true, maxHeight: 400, maxWidth: 700, minHeight: 200, minWidth: 200, height: 300, width: 500, theme: theme,
initContent: function () {
//$(‘#tab’).jqxTabs({ height: ‘100%’, width: ‘100%’, theme: basicDemo.config.theme });
$(document).ready(function () {
$(‘#myMap).maps();
});
$(‘#window’).jqxWindow(‘focus’);
}
});
});

March 26, 2013 at 10:58 am Window full screen effect #18039

Dimitar

Participant

Hello vmanne,

Here is an example:

<!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>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.summer.css" type="text/css" />
    <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/jqxwindow.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var width = $(window).width();
            var height = $(window).height();
            $('#window').jqxWindow({
                animationType: 'slide', showCollapseButton: true, minHeight: 200, minWidth: 200, maxHeight: height + 100, maxWidth: width + 100, height: height, width: width, autoOpen: false, isModal: true,
                initContent: function () {
                    $('#window').jqxWindow('focus');
                }
            });
            $("#open").click(function () {
                $("#window").jqxWindow('open');
            });
        });
    </script>
</head>
<body>
    <div id='content'>
        <button id="open">
            Open window</button>
        <div id='window'>
            <div>
                Header</div>
            <div>
                Content</div>
        </div>
    </div>
</body>
</html>

Please note that calling $(document).ready multiple times is not a good practice.

Best Regards,
Dimitar

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

Author

Posts

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

You must be logged in to reply to this topic.