0

I need help with my web app I am working on NetBeans 7.4 and I can't get the header to appear on the first page and for some reason my links to the quiz page don't work even though the code is the same and it works for the other pages? if anyone could help me I would really appreciate it code is as follows.

<html>
    <head>
        <title>Poker Wizard</title>
        <link rel ="stylesheet" type="text/css" href="css/jquery.mobile-1.3.2.css"/>
        <script src="js/jquery-2.0.3.js"></script>
        <script src="js/jquery.mobile-1.3.2.js"></script> 
    </head>
    <body>
        <div data-role="page" id="home" data-theme="a"> 
            <div date-role="header"> 
               <h1>Welcome to the Poker Wizard!</h1> 
        </div>
        <div data-role="content">
        Welcome to the Poker Wizard its still under construction...
        <ul>
        <a href="#strategy">Poker Strategy</a></li>
        </ul>
        <ul>
        <a href="#hints&tips">Hints & Tips</a></li> 
        </ul>
        <ul>
        <a href="#rules">Rules of Poker</a></li> 
        </ul>
        <ul>
        <a href="#quiz">Take Quiz</a></li>
        </ul>
        </div>
        <div data-role="footer" data-position="fixed"> 
            <h3>&copy;Jack Leigh 2014</h3>
        </div>     
        </div>
    </div>
    <div data-role="page" id="strategy" data-theme="a">
        <div data-role="header">
            <h1>Strategy</h1>
        </div>
        <div data-role="content">
            First things first, you need to learn the strategies of Poker 
            in order to be able to play it. Decide whether you are going to play
            for fun or money as the your approach to the game will be completely 
            different depending on your decision. 
        </div>
        <div data-role="footer" data-position="fixed" class="ui-bar">
            <a data-role="button" data-icon="home" href="index.html">Home</a>
        </div>
    </div>
    <div data-role="page" id="hints&tips" data-theme="a"> 
        <div data-role="header">
            <h1>Hints & Tips</h1>
        </div>
        <div data-role="content">
            This page will be about Hints & Tips of Poker
        </div>
        <div data-role="footer" data-position="fixed" class="ui-bar">
            <a data-role="button" data-icon="home" href="index.html">Home</a>
    </div>
    <div data-role="page" id="rules" data-theme="a"> 
        <div data-role="header">
            <h1>Rules</h1>
        </div>
        <div data-role="content">
            This page will be about the rules of poker
        </div>
        <div data-role="footer" data-position="fixed" class="ui-bar">
            <a data-role="button" data-icon="home" href="index.html">Home</a>
        </div>
        <div data-role="page" id="quiz" data-theme="a">
            <div data-role="header">
                <h1>quiz</h1>
        </div>
        <div data-role="content">
                This page will be the Quiz!
        </div>
        <div data-role ="footer" data-position="fixed" class="ui-bar">
            <a data-role="button" data-icon="home" href="index.html">Home</a>
        <div/>
    </body>
</html>
Tiny
  • 27,221
  • 105
  • 339
  • 599
user3241906
  • 1
  • 1

1 Answers1

0
<div data-role="page" id="home" data-theme="a"> 
      <div date-role="header">

On the second line you maybe would like to fix spelling and change date-role to data-role. I hope this is enough to accomplish what you need.

Be careful with the IDs too, double check everything. Working with jQuery Mobile is a very detailed activity.

Liam James
  • 414
  • 1
  • 6
  • 15
  • I am not sure you can use such anchors #hints&tips with "&" just like that. Check this too: http://demos.jquerymobile.com/1.2.0/docs/pages/page-links.html – Liam James Jan 28 '14 at 11:44
  • Anton thankyou for the help cant believe I missed the spell error :| I've managed to sort the header and the links out do you have any idea how to code accordion jquery widget into my pages?? – user3241906 Jan 28 '14 at 16:43