diff --git a/src/js/serialize.js b/src/js/serialize.js
index b015012b..6df7af7a 100644
--- a/src/js/serialize.js
+++ b/src/js/serialize.js
@@ -126,7 +126,10 @@ var DEBUG = true,
                 if (typeof attrName  === "object") {
                     var attrMap = attrName;
                     attrName = attrMap.name;
-                    attrValue = attrMap.value[propValue];
+                    if (typeof attrMap.value  === "function")
+                        attrValue = attrMap.value(propValue);
+                    else
+                        attrValue = attrMap.value[propValue];
                 }
                 if (attrName) {
                     propDefault = BWidget.getPropertyDefault(type, p);
diff --git a/src/js/widgets.js b/src/js/widgets.js
index 0839c5fa..89a5a08a 100644
--- a/src/js/widgets.js
+++ b/src/js/widgets.js
@@ -209,14 +209,34 @@ var BWidgetRegistry = {
             }
         ],
     },
-
+    /**
+    *Support background images using <div>
+    */
+    Background:{
+        parent: "Base",
+        properties: {
+            background: {
+                type: "string",
+                defaultValue: "",
+                htmlAttribute: {
+                    name: "style",
+                    value: function (propValue) {
+                        return "background-image:url('" + propValue + "');" +
+                            "background-attachment:scroll;" +
+                            "background-repeat:no-repeat;" +
+                            "background-size:cover;";
+                    }
+                }
+            }
+        }
+    },
     /**
      * Represents a page or dialog in the application. Includes "top" zone
      * for an optional header, "content" zone for the Content area, and "bottom"
      * zone for an optional footer.
      */
     Page: {
-        parent: "Base",
+        parent: "Background",
         allowIn: "Design",
         template: function (node) {
             var prop, code = $('<div data-role="page"></div>');
@@ -273,7 +293,7 @@ var BWidgetRegistry = {
      * for optional buttons, and "bottom" zone for an optional navbar.
      */
     Header: {
-        parent: "Base",
+        parent: "Background",
         allowIn: "Page",
         dragHeader: true,
         paletteImageName: "jqm_header.svg",
@@ -342,7 +362,7 @@ var BWidgetRegistry = {
      * Represents a footer object at the bottom of a page.
      */
     Footer: {
-        parent: "Base",
+        parent: "Background",
         allowIn: "Page",
         dragHeader: true,
         paletteImageName: "jqm_footer.svg",