Сайт jQuery Mobile не работает на устройстве после обновления до jQuery 1.6 / JQM b1

Я разработал сайт с jQuery для мобильных устройств, который работает в системе управления контентом Kentico. Ранее я пытался перейти на jQuery 1.6, но это нарушило плавную компоновку на устройствах. Страница загружена слишком большого размера, и ее размер не изменится. Текучесть все еще работала нормально при просмотре на рабочем столе.

С выпуском jQuery Mobile beta 1 я решил попробовать еще раз, и у меня та же проблема. Ошибок js не возникает, и я безуспешно пытался отключить все наши пользовательские стили. Я не могу найти никаких записей о том, что это происходило с кем-либо еще, и я застрял. Я бы хотел перейти на JQMb1, но, очевидно, не могу в текущем состоянии.

Вот источник домашней страницы. Кентико подбрасывает много вещей, которые я, к сожалению, не могу контролировать.

<!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 id="Head1"><title>

    mobile

</title><meta name="description" content="" /> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
<meta http-equiv="pragma" content="no-cache" /> 
<meta http-equiv="content-style-type" content="text/css" /> 
<meta http-equiv="content-script-type" content="text/javascript" /> 
<meta name="keywords" content="" /> 
<link type="text/css" rel="stylesheet" href="/CMSPages/GetCSS.aspx?stylesheetname=EcommerceSite" /> 
<link href="/CMSPages/GetCSS.aspx?stylesheetname=EcommerceSitePrinter" type="text/css" rel="stylesheet" media="print" />

<meta name="google-site-verification" content="" />

<meta name="msvalidate.01" content="" /><!--<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />-->

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />

<!--<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js">-->

<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>

<!--<script type="text/javascript">

$(document).bind('mobileinit', function () {

    $.mobile.ajaxFormsEnabled = false;

    $.mobile.ajaxLinksEnabled = false;

    $.mobile.selectmenu.prototype.options.nativeMenu = false;

});

</script>-->

<!--<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>-->

<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>

<style type="text/css">

body {font-size:100%;}

</style>

<link rel="stylesheet" href="/App_Themes/MobileSite/mobile.css" /> 
<link rel="shortcut icon" href="/favicon.ico" /> 
<link rel="icon" href="/favicon.ico" /><link href="App_Themes/EcommerceSite/Dialogs.css" type="text/css" rel="stylesheet" /></head>

<body class="LTR Safari ENUS"   style="background-color: white">

    <form method="post" action="/mobile.aspx" id="form1">

<div>

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />

<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTU2MjkyNjQyN2Rk46frlQiixWa5BweTAF7ndB5qwTA=" />

</div>



<script type="text/javascript">

//<![CDATA[

var theForm = document.forms['form1'];

if (!theForm) {

    theForm = document.form1;

}

function __doPostBack(eventTarget, eventArgument) {

    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {

        theForm.__EVENTTARGET.value = eventTarget;

        theForm.__EVENTARGUMENT.value = eventArgument;

        theForm.submit();

    }

}

//]]>

</script>





<script src="/WebResource.axd?d=hHbumMRRUKYZ0vrqhcQN_yfc6MpmVVxjApSmuWWVdvCs6PmLi2zVUXMD41WcsEU-xj5ziYAl-mqMN93BNPoItj905TM1&amp;t=634210220612724343" type="text/javascript"></script>



<div><input type="hidden" name="lng" id="lng" value="en-US" /> 
</div>

<script src="/ScriptResource.axd?d=OfR1_m-9FCjVieMCBtOoBHuRwsvK6yhyrqoOPYPF-6Fhud-MlDCtVtQ4dden6mSdtIjwbWesBqCiKDYzo-adCHCXFrzvtJnNmx1juFld48dTUVVX8nMAbzcOOgBB8DUe8-PkYtxRgG3P1wT9F7tNC31HmqU1&amp;t=ffffffffb5d86596" type="text/javascript"></script>

<script src="/ScriptResource.axd?d=zxM8t7Y1GgqE09OjHvkg-h42U8eTMkVp3YKfpojTrN8cx47sdhzZq-dDO2v6aYxR6hR5_tbvXqF7SLAJvvsn5INWAI2dsH85dykE8JWfZeEMQ4QGjTXy8-3pwbkZZs_x9sTa0pvzNeV-tFROFxF5PMwPzJkfql19aYYQd6_C5fBctCaZ0&amp;t=ffffffffb5d86596" type="text/javascript"></script>

    <div id="manPortal">



</div><script type="text/javascript">

//<![CDATA[

Sys.WebForms.PageRequestManager._initialize('manScript', document.getElementById('form1'));

Sys.WebForms.PageRequestManager.getInstance()._updateControls([], [], [], 90);

//]]>

</script>




<div data-role="page">

<div data-role="header">

    <!--<a href="#" data-rel="back" data-icon="arrow-l">Back</a>-->

    <h1>Mobile</h1>

</div>

<div data-role="content">





<div id="header-sep">&nbsp;</div>

<ul style="height:auto;" class="slider">

    <li id="1"><a href="#"><img alt="" src="/App_Themes/MobileSite/Images/ambulatory.jpg" /></a></li>

    <li id="2"><a href="#"><img alt="" src="/App_Themes/MobileSite/Images/express-stroke-screening.jpg" /></a></li>

</ul>

<a data-role="button" href="/mobile/services.aspx">Our Services</a> <a data-role="button" href="/mobile/locations.aspx">Locations</a> <a data-role="button" href="/mobile/findadoctor/advanced.aspx">Find a Doctor</a>





</div>

<div data-role="footer">

            <p>

                <a href="#">Full Site</a> | <a href="/mobile/about.aspx">About Us</a> | <a href="#">Mobile Apps</a> | <a href="/mobile/privacy.aspx">Privacy Policies</a><br />

                &copy; 2011.<br />Contact Us: 

            </p>

            <div class="social">

                <p>Follow Us:</p>

                <ul> 

                   <li class="facebook"><a href="#" target="_blank">Facebook</a></li>

                   <li class="twitter"><a href="#" target="_blank">Twitter</a></li>

                   <li class="youtube"><a href="#" target="_blank">YouTube</a></li>

                </ul>

            </div>

</div>

</div>

<script src="/App_Themes/MobileSite/script.js"></script>

<script src="/App_Themes/MobileSite/responsive-slider.js"></script> 







<script type="text/javascript">

//<![CDATA[

Sys.Application.initialize();

//]]>

</script>

</form>

</body>

</html>

person atfergs    schedule 21.06.2011    source источник
comment
можете ли вы опубликовать код или ссылку на jsfiddle.net?   -  person Phill Pafford    schedule 21.06.2011
comment
Конечно, что ты хочешь увидеть? Это просто стандартный jquery и jqm, а мой контент заключен в div страниц в соответствии со стандартом jqm.   -  person atfergs    schedule 21.06.2011
comment
Хорошо, я только что опубликовал всю страницу ... Думаю, поэтому мне отказали.   -  person atfergs    schedule 21.06.2011


Ответы (1)


Попробуйте добавить в свои метатеги следующее:

    <meta name="viewport" content="width=device-width, initial-scale=1">
person Jason Pudzianowski    schedule 23.06.2011