frequent

<!-- not perfect yet, but going in the right direction ... -->

<!-- list element from within actionsheet should be triggered -->
<ul data-role="listview" data-inset="true" class="socialize">					
        <li><a data-trigger="actionsheet" id="as1" href="#"><img src="iconSprite" class="ui-li-icon" alt="" />Favorite</a></li>
        <li><a data-trigger="actionsheet" id="as2" href="#"><img src="iconSprite" class="ui-li-icon" alt="" />Hide</a></li>
</ul>

<!-- action sheets -->
<!-- need to be place outside list element, otherwise CSS is not working properly once activated-->

frequent

<img src="large-default-file.jpg">
    <source src="smaller.jpg" media="max-width:600px">
    <source src="tiny.jpg" media="max-width:320px">
</img>

frequent

<!-- Mobile meta & links -->

<!-- Reference

Custom Icon and Image Creation Guidelines:
http://developer.apple.com/library/safari/#documentation/UserExperience/Conceptual/MobileHIG/IconsImages/IconsImages.html

Configuring Web Applications:
http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/configuringwebapplications/configuringwebapplications.html

frequent

// First, let's define a widget/plugin called "foo"

// Either using jQuery's $.fn plugin namespace, for simple stateless plugins...
$.fn.foo = function(){

  // In this scope, this refers to the element on which the plugin foo() was called 
  // manipulate it and return this at the end, so it can be chainable

};

frequent

<div data-role="page" id="your_wrapper_id" data-wrapper="true">
   <!-- global header --> 
   <div data-role="panel" data-id="your_menu_panel_id" data-panel="menu">
        <div data-role="page" id="your_menu_page_id" data-show="first">
            <!-- local header -->
            <!-- page content -->
            <!-- local footer -->
        </div>
    </div>
    <div data-role="panel" data-id="your_main_panel_id" data-panel="main">

frequent

<!-- panel transitions on HTML links -->
<a href="somePage.html" data-transition="fade" data-panel="your_panel_id">

<!-- programmatic -->
$.mobile.changePage('somePage.html', {
                        transition: 'fade', 
                        pageContainer: $('div:jqmData(id="your_panel_id")') 
                    });

frequent

// this is from a larger file, fit as you need:
var priv = {};


priv.generator = {

  /**
   * Generates elements based on supplied configuration
   * @method: makeElement
   * @param: {type} string Type of element to generate

frequent

var util = {};
 
/**
   * IE8 compatible custom event listener
   * @method listenToCustomEvents
   * @param {string} eventName Event to listen for
   * @param {method} callback Method to run on event
   */
  util.listenToCustomEvents = function (event_name, callback) {
    if (document.addEventListener) {

frequent

var container = document.createDocumentFragment();
var foo = document.createElement("div")
foo.id = "mh";
var bar = document.createElement("div")
bar.id = "ha";
foo.appendChild(bar);
container.appendChild(foo);

var x = {
  "fragment": container,

frequent

loading > index.html#{"level 1 - module"}/{"level 2 - item"}

[
  // level 1:
  { 
    "property_dict": {
      "title": "Servers"
    },
    "view_dict": {
      "default": [{"href": "network_overview"}],