BlogSpot 中的 JavaScript/Jquery 在移动浏览器中不起作用

Question

My page in BlogSpot works fine except in the mobile browsers I've tried (only an old iPod touch and my Windows 8 Phone, so I'm not sure about others).

The page is here .

Basically, after pressing a button object, JQuery populates a DIV with an .html() function, making the DIV grow in size, and I think that's the problem.

I was wondering if there is any way to fix this.

Answer 1

The problem here is that blogger loads different templates for mobile device and a PC. The PC version of your blog has all the necessary codes to run the function but the mobile template don't seem to have them.

Your script and the jQuery library doesn't load up in the mobile template, so you need to make some changes in your template to make it load on mobile browsers too. It's very simple, all you have to do is wrap the codes between

<b:if cond='data:blog.isMobile'></b:if>

And the scripts will be loaded in mobile templates too.

It must look like this

<b:if cond='data:blog.isMobile'>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

<script>
// your script
</script>
</b:if>

Place this anywhere template (best if near the original scripts) and save the template. And first check it on your PC by loading the mobile template of your blog, to do that just add ?m=1 at the end of your blog's URL.

Answer 2

As @Deepak Kamat stated .. it won't work even if you put the javascript code inside

<b:if cond='data:blog.isMobile'></b:if>

All you need to do is choose the right mobile template, in this case I believe you've made some changes on your Desktop template, so you must choose "Custom" from the mobile template drop down list

Answer 3

Yes, i tried to fix this then i found some steps to enable this on mobile mode but when you put this script code in add gadget then for me it not worked here is some step that i followed - first i opened the theme and then click on ... menu choose edit html and finally put these below line of code and it worked. i posted some of picture hope it will be helped.

<b:if cond='data:blog.isMobile'><script>console.log(&quot;Hello&quot;)</script></b:if>