0

Hi all I have the following code

<script type="text/javascript" src="/js/jquery-2.0.0.min.js"></script>
<script src="/js/jquery.mobile-1.3.1.js" type="text/javascript"></script>

but for some reason in Chrome and on any android it just crashes the page and at the bottom I just get a "Loading" message

does anyone know why?

thanks

Improve this question
1
  • if that's all of your code, then maybe it is the expected behaviour. Commented Jun 17, 2013 at 8:07

2 Answers 2

Reset to default
1

Solution

Don't use jQuery 2.0 with jQuery mobile 1.3.1

jQuery Mobile is locked to a certain jQuery version range. Use only jQuery 1.7 up to 1.9.X

And you have several errors in your live example.

CSS should be initialized before js files and your HTML tag was missing. Also DIV containing the page must have data-role="page" attribute.

EDIT :

Your final code should look like this:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
  <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.css">
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.min.js'></script>
  <script type="text/javascript" src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<title>Packer Forbes Communications</title>
</head>
<body>
<div id="pageHead" data-role="page">
<div id="logo"><img src="images/packerForbesLogo.jpg" width="226" height="106" alt="Packer Forbes" /></div>
  <div id="socMedia"><a href="http://www.pmlive.com/pmhub/healthcare_public_relations/packer_forbes_communications" target="_blank"><img src="/images/socIconPM.jpg" width="35" height="40" alt="PMLive" /></a><a href="http://www.linkedin.com/company/packer-forbes-communications?trk=top_nav_home" target="_blank"><img src="/images/socIconIN.jpg" width="35" height="40" alt="LinkedIn" /></a><a href="https://twitter.com/PackerForbes" target="_blank"><img src="/images/socIconTW.jpg" width="35" height="40" alt="Twitter" /></a><a href="http://www.youtube.com/playlist?list=PL4D83CC0DD394EF97&feature=view_all" target=_"blank"><img src="/images/socIconYT.jpg" width="35" height="40" alt="YouTube" /></a></div>

  <div id="mainNav" role="navigation"> 
  <a href="#nav" title="Show navigation" class="mobileonly">Show navigation</a> 
  <a href="#" title="Hide navigation" class="mobileonly">Hide navigation</a>
    <ul id="nav" class="clearfix">
      <li><a href="/index.html" class="selected">Home</a></li>
      <li><a href="/what-we-do/index.html">What We Do</a>
          <ul>
            <li><a href="/what-we-do/market-access/index.html">Market Access</a></li>
            <li class="navIndent"><a href="/what-we-do/market-access/case-studies.html">Case Studies</a></li>
            <li><a href="/what-we-do/pr/index.html">Public Relations</a></li>
            <li class="navIndent"><a href="/what-we-do/pr/case-studies.html">Case Studies</a></li>
            <li><a href="/what-we-do/medical-education/index.html">Medical Education</a></li>
            <li class="navIndent"><a href="/what-we-do/medical-education/case-studies.html">Case Studies</a></li>
            <li><a href="/what-we-do/digital/index.html">Digital</a></li>
            <li class="navIndent"><a href="/what-we-do/digital/case-studies.html">Case Studies</a></li>
          </ul>
      </li>
      <li><a href="/about-us/index.html">About Us</a>
        <ul>
          <li><a href="/about-us/awards.html">Awards</a></li>
          <li><a href="/about-us/the-team.html">The Team</a></li>
          <li><a href="/about-us/life-at-packer-forbes.html">Life at Packer Forbes</a></li>
          <li><a href="/about-us/our-values.html">Our Values</a></li>
        </ul>
      </li>
      <li><a href="/clients/index.html">Clients</a></li>
      <li><a href="/news/index.html">News</a></li>
      <li><a href="/careers/index.html">Careers</a>
        <ul>
          <li><a href="/careers/training.html">Training</a></li>
          <li><a href="/careers/internships.html">Internships</a></li>
          <li><a href="/careers/benefits.html">Benefits</a></li>
          <li><a href="/careers/current-vacancies.html">Current Vacancies</a></li>
        </ul>
      </li>
      <li><a href="/contact/index.html">Contact</a></li>
      <li><a href="http://downloads.packerforbes.com" target="_blank">Download Centre</a></li>
    </ul>
  </div>
  <div id="mainBanner"><a href="/news/index.html"><img src="images/twentyBanner.gif" alt="We Are Twenty!" width="400" height="80" border="0" class="homeBanner" /></a></div>
  </div>
  
  <div id="mainBody">
    <div id="contentWrapper">
  <p class="brandStrip">&nbsp;</p>
        <div id="mainColumn">
            <!--<h1>Who We Are</h1>-->
            <h2>What We Do</h2>
            <div id="marketAccess"> <a href="/what-we-do/market-access/index.html"><img src="images/marketAccess.jpg" width="160" height="160" alt="Market Access" /></a>
            <h3><a href="/what-we-do/market-access/index.html">Market Access</a></h3>
            </div>
            <div id="communications"> <a href="/what-we-do/pr/index.html"><img src="images/communications.jpg" width="160" height="160" alt="Communications" /></a>
              <h3><a href="/what-we-do/pr/index.html">Public Relations</a></h3>
            </div>
            <div id="medicalEducation"> <a href="/what-we-do/medical-education/index.html"><img src="images/medicalEducation.jpg" width="160" height="160" alt="Medical Education" /></a>
            <h3><a href="/what-we-do/medical-education/index.html">Medical Education</a></h3>
            </div>
            <div id="digital"><a href="/what-we-do/digital/index.html"><img src="images/digital.jpg" width="160" height="160" alt="Digital" /></a>
              <h3><a href="/what-we-do/digital/index.html">Digital</a></h3>
            </div>
            <p class="firstParaHome">Packer Forbes is an award-winning independent healthcare communications consultancy, specialising in medical communications.  Our integrated approach ensures that our clients benefit from a compelling fusion of bespoke market access, public relations, medical education and digital communications approaches, all built on insight developed from years of experience.</p>
            <p class="dividerLong"><span class="dividerLongMore"><a href="/what-we-do/index.html">Find Out More»</a></span></p>
            <p class="mobileindexorgslogos">
                <a href="http://www.hca-uk.org/" target="_blank"><img src="images/logoHCA.jpg" width="102" height="109" alt="HCA" /></a>
                <a href="http://www.emig.org.uk/" target="_blank" class="mobileindexorgslogosemig"><img src="images/logoEMIG.jpg" width="102" height="109" alt="EMIG" /></a>
                <a href="http://www.investorsinpeople.co.uk/" target="_blank"><img src="images/logoIIP.jpg" width="121" height="109" alt="IIP" /></a>
                <a href="http://www.abpi.org.uk/about-us/membership/Pages/general-affiliate-list.aspx#p" target="_blank"><img src="images/abpi_new.jpg" width="102" height="109" alt="IIP" /></a>
                <div class="mobileclear"></div>
            </p>

      </div>
        <div id="sideColumn"></div>
        <p class="brandStrip">&nbsp;</p>
    </div>
</div>
<div id="pageFoot">
    <ul>
        <li>1.09 Harbour Yard, Chelsea Harbour, London, SW10 0XD</li>
        <li>t: +44 (0)20 7036 8550</li>
        <li>f: +44 (0)20 7036 8569</li>
        <li><a href="mailto:[email protected]">e: [email protected]</a></li>
        <li><a href="/contact/cookie-policy.html">cookie policy</a></li>
    </ul>
    <p>Registered office: Packer Forbes Communications Ltd, 1.09 Harbour Yard, Chelsea Harbour, SW10 0XD Registered number: 3753460  </p>

</div>


</body>
</html>
Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

Ive downloading and im using 1.8.2 but its still doing the same, have you any more ideas?
You have forgor to initialize jQuery Mobile css. Only then your test page will be correct. I have looked at your demo page.
Use this version of js and css: jquerymobile.com/blog/2013/04/10/announcing-jquery-mobile-1-3-1 don't try to mix 1.3.0 beta js and 1.3.1. css.
it seems that i need to use use jquery.css for jquery.mobile to work. but if I use jquery.css it messes everything else up but thanks anyway
Tell me what do you need jQuery Mobile for?
0

If you are using JQM 1.3.1, you can use this 2 script files.

jQuery JavaScript Library v1.9.1 http://view.jquerymobile.com/1.3.1/dist/demos/js/jquery.js

jQuery Mobile 1.3.1 http://view.jquerymobile.com/1.3.1/dist/demos/js/jquery.mobile.min.js

Loading message error

If you want to hide this message, try to use this as soon as on load.

$(document).ready(function() {
    $('.ui-loader').hide();
});
Improve this answer

12 Comments

ive just changed my jquery files for the ones you suggested and its still the same. Ive created a demo page to see here packerforbes.anytimeafter9.co.uk/delete.html
so, you don't want the JQM style? Try to remove [reset.css] file and see? Loading message error is because of JQM added a hidden loading message and it will be shown according to some event.
Ha yes that does get rid of the error message but jquery is still disable for the rest of the page. packerforbes.anytimeafter9.co.uk/delete.html
Ive deleted all css includes and all other javascript includes now so I just have the two javascript includes and I'm still getting this "Loading" error
Now add this JQM css, view.jquerymobile.com/1.3.1/dist/demos/css/themes/default/…
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.