{"id":3785,"date":"2014-10-09T09:46:43","date_gmt":"2014-10-09T00:46:43","guid":{"rendered":"https:\/\/gunmagisgeek.com\/wordpress\/?p=3785"},"modified":"2019-01-11T14:50:39","modified_gmt":"2019-01-11T05:50:39","slug":"post-3785","status":"publish","type":"post","link":"https:\/\/gunmagisgeek.com\/blog\/webix\/3785","title":{"rendered":"Webix\u3068snap.js\u3092\u7d44\u307f\u5408\u308f\u305b\u308b\u3002"},"content":{"rendered":"<p><a href=\"https:\/\/webix.com\/\">Webix<\/a>\u306f\u3001\u30b9\u30de\u30fc\u30c8\u30d5\u30a9\u30f3\u3067\u306e\u8868\u793a\u306b\u5bfe\u5fdc\u3057\u305fUI\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u3067\u3059\u304c\u3001\u3044\u308f\u3086\u308b\u30b9\u30e9\u30a4\u30c9\u30e1\u30cb\u30e5\u30fc\u3068\u547c\u3070\u308c\u308b\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u3082\u3063\u3066\u3044\u307e\u305b\u3093\u3002<\/p>\n<p><a href=\"https:\/\/webix.com\/demos\/touch.html\" target=\"_blank\">Webix\u30e2\u30d0\u30a4\u30eb\u3000Demo<\/a><\/p>\n<p>\u305d\u3053\u3067\u30b9\u30e9\u30a4\u30c9\u30e1\u30cb\u30e5\u30fc\u306f<a href=\"http:\/\/jakiestfu.github.io\/Snap.js\/demo\/apps\/default.html\">snap.js<\/a>\u3092\u4f7f\u3063\u3066\u5b9f\u88c5\u3057\u305d\u308c\u4ee5\u5916\u306fwebix\u3092\u7d44\u307f\u5408\u308f\u305b\u3066\u753b\u9762\u3092\u3064\u304f\u3063\u3066\u307f\u307e\u3057\u305f\u3002<br \/>\n\u826f\u3044\u611f\u3058\u3067\u7d44\u307f\u5408\u308f\u3055\u3063\u305f\u306e\u3067\u3001\u4eca\u5f8c\u5229\u7528\u3057\u3066\u3044\u304d\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n<h2>\u30b5\u30f3\u30d7\u30eb<\/h2>\n<p><iframe loading=\"lazy\" id=\"demo\" src=\"https:\/\/shimz.me\/example\/snapjs\/webix\/\" width=\"320\" height=\"512\"><\/iframe><\/p>\n<pre class=\"lang:xhtml decode:true \" >&lt;!DOCTYPE HTML&gt;\n&lt;html lang=\"ja\"&gt;\n&lt;head&gt;\n&lt;title&gt;snap.js + Webix&lt;\/title&gt;\n&lt;meta charset=\"utf-8\"&gt;\n&lt;meta http-equiv=\"x-ua-compatible\" content=\"IE=edge\"&gt;\n&lt;meta name=\"viewport\" content=\"initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no\"&gt;\n&lt;meta name=\"apple-mobile-web-app-capable\" content=\"yes\"&gt;\n&lt;meta name=\"apple-touch-fullscreen\" content=\"yes\"&gt;\n    \n&lt;!-- snap.js\u7528\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8--&gt;   \n&lt;link rel=\"stylesheet\" type=\"text\/css\" href=\"..\/css\/snap.css\"&gt;\n&lt;link rel=\"stylesheet\" type=\"text\/css\" href=\"..\/css\/snap_opt.css\"&gt;\n\n&lt;!-- webix\u7528\u30b9\u30bf\u30a4\u30eb\u30b7\u30fc\u30c8 --&gt;\n&lt;link rel=\"stylesheet\" href=\"http:\/\/shimz.me\/libs\/webix\/codebase\/webix.css\" type=\"text\/css\" charset=\"utf-8\"&gt;\n\n&lt;style&gt;\nhtml, body{\n    margin: 0px;\n    padding: 0px;\n}\nhtml, body, #webix-view {\n    width: 100%;\n    height: 100%;\n}   \n&lt;\/style&gt;\n\n&lt;\/head&gt;\n&lt;body&gt;\n    \n&lt;!-- slide menu --&gt;\n&lt;div class=\"snap-drawers\"&gt;\n    &lt;div class=\"snap-drawer snap-drawer-left\"&gt;\n        &lt;div&gt;\n            &lt;h3&gt;\u30e1\u30cb\u30e5\u30fc&lt;\/h3&gt;\n            \n            &lt;h4&gt;\u30b5\u30d6\u30e1\u30cb\u30e5\u30fc\uff11&lt;\/h4&gt;\n            &lt;ul&gt;\n                &lt;li&gt;&lt;a&gt;\u307b\u3052\uff11&lt;\/a&gt;&lt;\/li&gt;\n                &lt;li&gt;&lt;a&gt;\u307b\u3052\uff12&lt;\/a&gt;&lt;\/li&gt;\n            &lt;\/ul&gt;\n        &lt;\/div&gt;\n    &lt;\/div&gt;\n    &lt;div class=\"snap-drawer snap-drawer-right\"&gt;&lt;\/div&gt;\n&lt;\/div&gt;\n&lt;!-- slide menu end --&gt;\n\n&lt;!-- mein contents --&gt;    \n&lt;div id=\"content\" class=\"snap-content\"&gt;\n    &lt;div id=\"toolbar\"&gt;\n        &lt;a  id=\"open-left\"&gt;&lt;\/a&gt;\n        &lt;h1&gt;Webix &amp; Snap.js&lt;\/h1&gt;\n    &lt;\/div&gt;\n    &lt;div id=\"webix-view\" data-snap-ignore=\"true\"&gt;&lt;\/div&gt;         \n&lt;\/div&gt;\n&lt;!-- mein contents end --&gt;\n        \n        \n&lt;!-- snap.js(\u30b9\u30e9\u30a4\u30c9\u30e1\u30cb\u30e5\u30fc\u30e9\u30a4\u30d6\u30e9\u30ea) --&gt;       \n&lt;script type=\"text\/javascript\" src=\"..\/js\/snap.js\"&gt;&lt;\/script&gt;\n&lt;!-- webix.js --&gt;\n&lt;script src=\"http:\/\/shimz.me\/libs\/webix\/codebase\/webix.js\" type=\"text\/javascript\" charset=\"utf-8\"&gt;&lt;\/script&gt;\n\n&lt;script&gt;\n\/* snap.js\u521d\u671f\u5316*\/\n(function(){\n    snapper = new Snap({\n        element: document.getElementById('content')\n    }); \n    \n    var addEvent = function addEvent(element, eventName, func) {\n        if (element.addEventListener) {\n            return element.addEventListener(eventName, func, false);\n        } else if (element.attachEvent) {\n            return element.attachEvent(\"on\" + eventName, func);\n        }\n    };\n    \n    addEvent(document.getElementById('open-left'), 'click', function(){\n        if( snapper.state().state==\"left\" ){\n            snapper.close();\n        } else {\n            snapper.open('left');\n        }\n    });\n    \n})();\n\n\/* \u30e2\u30d0\u30a4\u30ebsafari\u304c\u30ea\u30f3\u30af\u3092\u958b\u304f\u306e\u3092\u9632\u3050 *\/\n(function (a, b, c) {\n    if(c in b &amp;&amp; b[c]) {\n        var d, e = a.location,\n            f = \/^(a|html)$\/i;\n        a.addEventListener(\"click\", function (a) {\n            d = a.target;\n            while(!f.test(d.nodeName)) d = d.parentNode;\n            \"href\" in d &amp;&amp; (d.href.indexOf(\"http\") || ~d.href.indexOf(e.host)) &amp;&amp; (a.preventDefault(), e.href = d.href)\n        }, !1)\n    }\n})(document, window.navigator, \"standalone\");   \n\n\/* webix\u521d\u671f\u5316*\/   \n(function(){\n    webix.ui.fullScreen();\n    webix.ui({\n        \/\/webix\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u8868\u793a\u3059\u308b\u8981\u7d20\u306eid\u5c5e\u6027\u3092\u6307\u5b9a\n        container:\"webix-view\",\n        rows:[\n            {template:\"header\", height:35 },\n            {template:\"row 1\"},\n            {view:\"resizer\"},\n            {template:\"row 2\"},\n            {view:\"resizer\"},\n            {\n                cols:[\n                    { template:\"column 1\", width:150},\n                    { view:\"resizer\" },\n                    { template:\"column 2\"},\n                    { template:\"column 3\"}\n                ]\n            }\n        ]\n    }).show();\n})();   \n&lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Webix\u306f\u3001\u30b9\u30de\u30fc\u30c8\u30d5\u30a9\u30f3\u3067\u306e\u8868\u793a\u306b\u5bfe\u5fdc\u3057\u305fUI&hellip;<\/p>\n","protected":false},"author":1,"featured_media":3786,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[58],"tags":[],"class_list":["post-3785","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webix","has-post-thumbnail-archive"],"_links":{"self":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/posts\/3785","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/comments?post=3785"}],"version-history":[{"count":0,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/posts\/3785\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/media\/3786"}],"wp:attachment":[{"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/media?parent=3785"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/categories?post=3785"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gunmagisgeek.com\/blog\/wp-json\/wp\/v2\/tags?post=3785"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}