+ sign: '0CB01533B8C1EF103065174F50BCA001', // signed string
+};
+
+Wechat.sendPaymentRequest(params, function () {
+ alert("Success");
+}, function (reason) {
+ alert("Failed: " + reason);
+});
+```
+
+# FAQ
+
+Q: After sharing in wechat, it will not get back to my app.
+
+A: (iOS)Please make sure the URL Type is correct. (Android) Your [app signature](https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&id=open1419318060&token=&lang=zh_CN) is correct.
+
+# TODO
+
+1. ~~Add android version~~
+
+2. ~~Share to wechat session(聊天) and wechat favorite(收藏)~~
+
+3. ~~Add other media types, including music etc.~~
+ <button onclick="javascript:JPushWeb.triggerNativeAction('test - triggerNativeAction');Javascript:JPushWeb.close();">triggerNativeAction and Close current webwiew</button>
+ background-color: #4596ce /*{global-active-background-color}*/; /* NOTE: this hex should match the active state color. It's repeated here for cascade */
+/* Transitions originally inspired by those from jQtouch, nice work, folks */
+.ui-mobile-viewport-transitioning,
+.ui-mobile-viewport-transitioning .ui-page {
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.in {
+ -webkit-animation-timing-function: ease-out;
+ -webkit-animation-duration: 350ms;
+ -moz-animation-timing-function: ease-out;
+ -moz-animation-duration: 350ms;
+}
+.out {
+ -webkit-animation-timing-function: ease-in;
+ -webkit-animation-duration: 225ms;
+ -moz-animation-timing-function: ease-in;
+ -moz-animation-duration: 225;
+}
+@-webkit-keyframes fadein {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+@-moz-keyframes fadein {
+ from { opacity: 0; }
+ to { opacity: 1; }
+}
+@-webkit-keyframes fadeout {
+ from { opacity: 1; }
+ to { opacity: 0; }
+}
+@-moz-keyframes fadeout {
+ from { opacity: 1; }
+ to { opacity: 0; }
+}
+.fade.out {
+ opacity: 0;
+ -webkit-animation-duration: 125ms;
+ -webkit-animation-name: fadeout;
+ -moz-animation-duration: 125ms;
+ -moz-animation-name: fadeout;
+}
+.fade.in {
+ opacity: 1;
+ -webkit-animation-duration: 225ms;
+ -webkit-animation-name: fadein;
+ -moz-animation-duration: 225ms;
+ -moz-animation-name: fadein;
+}
+.pop {
+ -webkit-transform-origin: 50% 50%;
+ -moz-transform-origin: 50% 50%;
+}
+.pop.in {
+ -webkit-transform: scale(1);
+ -moz-transform: scale(1);
+ opacity: 1;
+ -webkit-animation-name: popin;
+ -moz-animation-name: popin;
+ -webkit-animation-duration: 350ms;
+ -moz-animation-duration: 350ms;
+}
+.pop.out {
+ -webkit-animation-name: fadeout;
+ -moz-animation-name: fadeout;
+ opacity: 0;
+ -webkit-animation-duration: 100ms;
+ -moz-animation-duration: 100ms;
+}
+.pop.in.reverse {
+ -webkit-animation-name: fadein;
+ -moz-animation-name: fadein;
+}
+.pop.out.reverse {
+ -webkit-transform: scale(.8);
+ -moz-transform: scale(.8);
+ -webkit-animation-name: popout;
+ -moz-animation-name: popout;
+}
+@-webkit-keyframes popin {
+ from {
+ -webkit-transform: scale(.8);
+ opacity: 0;
+ }
+ to {
+ -webkit-transform: scale(1);
+ opacity: 1;
+ }
+}
+@-moz-keyframes popin {
+ from {
+ -moz-transform: scale(.8);
+ opacity: 0;
+ }
+ to {
+ -moz-transform: scale(1);
+ opacity: 1;
+ }
+}
+@-webkit-keyframes popout {
+ from {
+ -webkit-transform: scale(1);
+ opacity: 1;
+ }
+ to {
+ -webkit-transform: scale(.8);
+ opacity: 0;
+ }
+}
+@-moz-keyframes popout {
+ from {
+ -moz-transform: scale(1);
+ opacity: 1;
+ }
+ to {
+ -moz-transform: scale(.8);
+ opacity: 0;
+ }
+}
+/* keyframes for slidein from sides */
+@-webkit-keyframes slideinfromright {
+ from { -webkit-transform: translateX(100%); }
+ to { -webkit-transform: translateX(0); }
+}
+@-moz-keyframes slideinfromright {
+ from { -moz-transform: translateX(100%); }
+ to { -moz-transform: translateX(0); }
+}
+@-webkit-keyframes slideinfromleft {
+ from { -webkit-transform: translateX(-100%); }
+ to { -webkit-transform: translateX(0); }
+}
+@-moz-keyframes slideinfromleft {
+ from { -moz-transform: translateX(-100%); }
+ to { -moz-transform: translateX(0); }
+}
+/* keyframes for slideout to sides */
+@-webkit-keyframes slideouttoleft {
+ from { -webkit-transform: translateX(0); }
+ to { -webkit-transform: translateX(-100%); }
+}
+@-moz-keyframes slideouttoleft {
+ from { -moz-transform: translateX(0); }
+ to { -moz-transform: translateX(-100%); }
+}
+@-webkit-keyframes slideouttoright {
+ from { -webkit-transform: translateX(0); }
+ to { -webkit-transform: translateX(100%); }
+}
+@-moz-keyframes slideouttoright {
+ from { -moz-transform: translateX(0); }
+ to { -moz-transform: translateX(100%); }
+}
+.slide.out, .slide.in {
+ -webkit-animation-timing-function: ease-out;
+ -webkit-animation-duration: 350ms;
+ -moz-animation-timing-function: ease-out;
+ -moz-animation-duration: 350ms;
+}
+.slide.out {
+ -webkit-transform: translateX(-100%);
+ -webkit-animation-name: slideouttoleft;
+ -moz-transform: translateX(-100%);
+ -moz-animation-name: slideouttoleft;
+}
+.slide.in {
+ -webkit-transform: translateX(0);
+ -webkit-animation-name: slideinfromright;
+ -moz-transform: translateX(0);
+ -moz-animation-name: slideinfromright;
+}
+.slide.out.reverse {
+ -webkit-transform: translateX(100%);
+ -webkit-animation-name: slideouttoright;
+ -moz-transform: translateX(100%);
+ -moz-animation-name: slideouttoright;
+}
+.slide.in.reverse {
+ -webkit-transform: translateX(0);
+ -webkit-animation-name: slideinfromleft;
+ -moz-transform: translateX(0);
+ -moz-animation-name: slideinfromleft;
+}
+.slidefade.out {
+ -webkit-transform: translateX(-100%);
+ -webkit-animation-name: slideouttoleft;
+ -moz-transform: translateX(-100%);
+ -moz-animation-name: slideouttoleft;
+ -webkit-animation-duration: 225ms;
+ -moz-animation-duration: 225ms;
+}
+.slidefade.in {
+ -webkit-transform: translateX(0);
+ -webkit-animation-name: fadein;
+ -moz-transform: translateX(0);
+ -moz-animation-name: fadein;
+ -webkit-animation-duration: 200ms;
+ -moz-animation-duration: 200ms;
+}
+.slidefade.out.reverse {
+ -webkit-transform: translateX(100%);
+ -webkit-animation-name: slideouttoright;
+ -moz-transform: translateX(100%);
+ -moz-animation-name: slideouttoright;
+ -webkit-animation-duration: 200ms;
+ -moz-animation-duration: 200ms;
+}
+.slidefade.in.reverse {
+ -webkit-transform: translateX(0);
+ -webkit-animation-name: fadein;
+ -moz-transform: translateX(0);
+ -moz-animation-name: fadein;
+ -webkit-animation-duration: 200ms;
+ -moz-animation-duration: 200ms;
+}
+/* slide down */
+.slidedown.out {
+ -webkit-animation-name: fadeout;
+ -moz-animation-name: fadeout;
+ -webkit-animation-duration: 100ms;
+ -moz-animation-duration: 100ms;
+}
+.slidedown.in {
+ -webkit-transform: translateY(0);
+ -webkit-animation-name: slideinfromtop;
+ -moz-transform: translateY(0);
+ -moz-animation-name: slideinfromtop;
+ -webkit-animation-duration: 250ms;
+ -moz-animation-duration: 250ms;
+}
+.slidedown.in.reverse {
+ -webkit-animation-name: fadein;
+ -moz-animation-name: fadein;
+ -webkit-animation-duration: 150ms;
+ -moz-animation-duration: 150ms;
+}
+.slidedown.out.reverse {
+ -webkit-transform: translateY(-100%);
+ -moz-transform: translateY(-100%);
+ -webkit-animation-name: slideouttotop;
+ -moz-animation-name: slideouttotop;
+ -webkit-animation-duration: 200ms;
+ -moz-animation-duration: 200ms;
+}
+@-webkit-keyframes slideinfromtop {
+ from { -webkit-transform: translateY(-100%); }
+ to { -webkit-transform: translateY(0); }
+}
+@-moz-keyframes slideinfromtop {
+ from { -moz-transform: translateY(-100%); }
+ to { -moz-transform: translateY(0); }
+}
+@-webkit-keyframes slideouttotop {
+ from { -webkit-transform: translateY(0); }
+ to { -webkit-transform: translateY(-100%); }
+}
+@-moz-keyframes slideouttotop {
+ from { -moz-transform: translateY(0); }
+ to { -moz-transform: translateY(-100%); }
+}
+/* slide up */
+.slideup.out {
+ -webkit-animation-name: fadeout;
+ -moz-animation-name: fadeout;
+ -webkit-animation-duration: 100ms;
+ -moz-animation-duration: 100ms;
+}
+.slideup.in {
+ -webkit-transform: translateY(0);
+ -webkit-animation-name: slideinfrombottom;
+ -moz-transform: translateY(0);
+ -moz-animation-name: slideinfrombottom;
+ -webkit-animation-duration: 250ms;
+ -moz-animation-duration: 250ms;
+}
+.slideup.in.reverse {
+ -webkit-animation-name: fadein;
+ -moz-animation-name: fadein;
+ -webkit-animation-duration: 150ms;
+ -moz-animation-duration: 150ms;
+}
+.slideup.out.reverse {
+ -webkit-transform: translateY(100%);
+ -moz-transform: translateY(100%);
+ -webkit-animation-name: slideouttobottom;
+ -moz-animation-name: slideouttobottom;
+ -webkit-animation-duration: 200ms;
+ -moz-animation-duration: 200ms;
+}
+@-webkit-keyframes slideinfrombottom {
+ from { -webkit-transform: translateY(100%); }
+ to { -webkit-transform: translateY(0); }
+}
+@-moz-keyframes slideinfrombottom {
+ from { -moz-transform: translateY(100%); }
+ to { -moz-transform: translateY(0); }
+}
+@-webkit-keyframes slideouttobottom {
+ from { -webkit-transform: translateY(0); }
+ to { -webkit-transform: translateY(100%); }
+}
+@-moz-keyframes slideouttobottom {
+ from { -moz-transform: translateY(0); }
+ to { -moz-transform: translateY(100%); }
+}
+/* The properties in this rule are only necessary for the 'flip' transition.
+ * We need specify the perspective to create a projection matrix. This will add
+ * some depth as the element flips. The depth number represents the distance of
+ * the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate
+ * value.
+ */
+.viewport-flip {
+ -webkit-perspective: 1000;
+ -moz-perspective: 1000;
+ position: absolute;
+}
+.flip {
+ -webkit-backface-visibility:hidden;
+ -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
+ -moz-backface-visibility:hidden;
+ -moz-transform:translateX(0);
+}
+.flip.out {
+ -webkit-transform: rotateY(-90deg) scale(.9);
+ -webkit-animation-name: flipouttoleft;
+ -webkit-animation-duration: 175ms;
+ -moz-transform: rotateY(-90deg) scale(.9);
+ -moz-animation-name: flipouttoleft;
+ -moz-animation-duration: 175ms;
+}
+.flip.in {
+ -webkit-animation-name: flipintoright;
+ -webkit-animation-duration: 225ms;
+ -moz-animation-name: flipintoright;
+ -moz-animation-duration: 225ms;
+}
+.flip.out.reverse {
+ -webkit-transform: rotateY(90deg) scale(.9);
+ -webkit-animation-name: flipouttoright;
+ -moz-transform: rotateY(90deg) scale(.9);
+ -moz-animation-name: flipouttoright;
+}
+.flip.in.reverse {
+ -webkit-animation-name: flipintoleft;
+ -moz-animation-name: flipintoleft;
+}
+@-webkit-keyframes flipouttoleft {
+ from { -webkit-transform: rotateY(0); }
+ to { -webkit-transform: rotateY(-90deg) scale(.9); }
+}
+@-moz-keyframes flipouttoleft {
+ from { -moz-transform: rotateY(0); }
+ to { -moz-transform: rotateY(-90deg) scale(.9); }
+}
+@-webkit-keyframes flipouttoright {
+ from { -webkit-transform: rotateY(0) ; }
+ to { -webkit-transform: rotateY(90deg) scale(.9); }
+}
+@-moz-keyframes flipouttoright {
+ from { -moz-transform: rotateY(0); }
+ to { -moz-transform: rotateY(90deg) scale(.9); }
+}
+@-webkit-keyframes flipintoleft {
+ from { -webkit-transform: rotateY(-90deg) scale(.9); }
+ to { -webkit-transform: rotateY(0); }
+}
+@-moz-keyframes flipintoleft {
+ from { -moz-transform: rotateY(-90deg) scale(.9); }
+ to { -moz-transform: rotateY(0); }
+}
+@-webkit-keyframes flipintoright {
+ from { -webkit-transform: rotateY(90deg) scale(.9); }
+ to { -webkit-transform: rotateY(0); }
+}
+@-moz-keyframes flipintoright {
+ from { -moz-transform: rotateY(90deg) scale(.9); }
+ to { -moz-transform: rotateY(0); }
+}
+/* The properties in this rule are only necessary for the 'flip' transition.
+ * We need specify the perspective to create a projection matrix. This will add
+ * some depth as the element flips. The depth number represents the distance of
+ * the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate
+ * value.
+ */
+.viewport-turn {
+ -webkit-perspective: 1000;
+ -moz-perspective: 1000;
+ position: absolute;
+}
+.turn {
+ -webkit-backface-visibility:hidden;
+ -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
+ -webkit-transform-origin: 0;
+
+ -moz-backface-visibility:hidden;
+ -moz-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
+ -moz-transform-origin: 0;
+}
+.turn.out {
+ -webkit-transform: rotateY(-90deg) scale(.9);
+ -webkit-animation-name: flipouttoleft;
+ -moz-transform: rotateY(-90deg) scale(.9);
+ -moz-animation-name: flipouttoleft;
+ -webkit-animation-duration: 125ms;
+ -moz-animation-duration: 125ms;
+}
+.turn.in {
+ -webkit-animation-name: flipintoright;
+ -moz-animation-name: flipintoright;
+ -webkit-animation-duration: 250ms;
+ -moz-animation-duration: 250ms;
+
+}
+.turn.out.reverse {
+ -webkit-transform: rotateY(90deg) scale(.9);
+ -webkit-animation-name: flipouttoright;
+ -moz-transform: rotateY(90deg) scale(.9);
+ -moz-animation-name: flipouttoright;
+}
+.turn.in.reverse {
+ -webkit-animation-name: flipintoleft;
+ -moz-animation-name: flipintoleft;
+}
+@-webkit-keyframes flipouttoleft {
+ from { -webkit-transform: rotateY(0); }
+ to { -webkit-transform: rotateY(-90deg) scale(.9); }
+}
+@-moz-keyframes flipouttoleft {
+ from { -moz-transform: rotateY(0); }
+ to { -moz-transform: rotateY(-90deg) scale(.9); }
+}
+@-webkit-keyframes flipouttoright {
+ from { -webkit-transform: rotateY(0) ; }
+ to { -webkit-transform: rotateY(90deg) scale(.9); }
+}
+@-moz-keyframes flipouttoright {
+ from { -moz-transform: rotateY(0); }
+ to { -moz-transform: rotateY(90deg) scale(.9); }
+}
+@-webkit-keyframes flipintoleft {
+ from { -webkit-transform: rotateY(-90deg) scale(.9); }
+ to { -webkit-transform: rotateY(0); }
+}
+@-moz-keyframes flipintoleft {
+ from { -moz-transform: rotateY(-90deg) scale(.9); }
+ to { -moz-transform: rotateY(0); }
+}
+@-webkit-keyframes flipintoright {
+ from { -webkit-transform: rotateY(90deg) scale(.9); }
+ to { -webkit-transform: rotateY(0); }
+}
+@-moz-keyframes flipintoright {
+ from { -moz-transform: rotateY(90deg) scale(.9); }
+/* Fixes #2588 — When Windows Phone 7.5 (Mango) tries to calculate a numeric opacity for a select—including “inherit”—without explicitly specifying an opacity on the parent to give it context, a bug appears where clicking elsewhere on the page after opening the select will open the select again. */
+/* To do: Exclude ui-slider-input from textinput widget initSelector. The class ui-input-text is added to the slider input and label. When this is fixed, the rule below can be deleted. */
+ // TODO: Post 1.1--once we have time to test thoroughly--any classes manually applied to the original element should be carried over to the enhanced element, with an `-enhanced` suffix. See https://github.com/jquery/jquery-mobile/issues/3577
+ // setup items that are generally necessary for select menu extension
+ _preExtension: function(){
+ var classes = "";
+ // TODO: Post 1.1--once we have time to test thoroughly--any classes manually applied to the original element should be carried over to the enhanced element, with an `-enhanced` suffix. See https://github.com/jquery/jquery-mobile/issues/3577