a4: data-title attribute not working

a4: data-title attribute not working

Per the release notes of Auto-updating page titles for Ajax navigatio n, there's a new attribute that should one to manually define a title. Either the attribute doesn't work, or I am missing something obvious. Also, I tried the attribute on different spots, just to verify. Correct me if I am wrong, but it should go with the DIV that has the data-role="page" attribute.


What am I missing to have the data-title attribute work correctly?


  2. <!DOCTYPE html> 
  3. <html> <head> 
  4. <title>Page Title 0</title> 
  5. <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css" />
  6. <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
  7. <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.js"></script>
  8. </head><body>

  10. <div data-role="page" id="page1" data-title="Manual Page Title 1">
  11. <div data-role="header" data-title="Manual Header Title 1">
  12. <h1>Page Title 1</h1>
  13. </div>
  14. <div data-role="content">
  15. <p>Page content goes here 1. go to <a href="#page2">page 2</a></p>
  16. </div>
  17. <div data-role="footer">
  18. <h4>Page Footer 1</h4>
  19. </div>
  20. </div>

  22. <div data-role="page" id="page2" data-title="Manual Page Title 2">
  23. <div data-role="header" data-title="Manual Header Title 2">
  24. <h1>Page Title 2</h1>
  25. </div>
  26. <div data-role="content">
  27. <p>Page content goes here 2. go to <a href="#page1">page 1</a></p>
  28. </div>
  29. <div data-role="footer">
  30. <h4>Page Footer 2</h4>
  31. </div>
  32. </div>

  34. </body></html>