Develop Reference

JS doesn't work on Safari on mobile devices only, can't replicate in Safari Console

Looking for ideas on how to debug instances where JS doesn't work on Safari mobile, works fine on desktop, and then in desktop when I open the Safari console and run the page again using Safari-iOS 9.3-iPhone (which is the version people have had issues on) on a mobile screen it still is working fine.
Thanks!

use can use safari remote debug, you can find a detail steps online

Mouse click and mouse over effect for turn.js not working

I was working upon a website with a flipbook kind of jQuery effect provided by turn.js.
It was working very well on my development environment. Suddenly have found out that the mouseover effect and mouseclick has stopped working on browser Chrome V29.0.1547.66m.
It works perfectly with V26.0.1410.63 and on other browsers (Firefox).
Need to know the reason and some workaround solution for the same.
Here is the link to my webpage.

I had checked your link, I think there is some problem in turn.min.js script. Use turn.js script in place of turn.min.js it is working fine on your link.

As per issue no 399 posted on blasten/github https://github.com/blasten/turn.js/issues/399 change your turn.min.js to latest version of turn.js. This will surely solve your issue with chrome browsers' latest version on windows.

helloi was using the unminified version of turnjs and still had problems with some browsers, i read the code and discovered that mouse move events were not dispatched
i tested with 2 computers :
old Toshiba laptop with 1st-gen i7, Windows 7 Pro SP1, Opera 35.0.2066.68, Firefox 44.0.2 64Bits
brand new Intel NUC5i7RYH, Windows 8.1 Pro, same browser versions
mouse events
working properly on NUC + Firefox and Toshiba + Opera
NOT working on NUC + Opera and Toshiba + Firefox
uh ?
mouse || touch callbacks are set at line 28
touch capacity is detected at line 26
the isTouch test at line 26 returns true on some desktop browsers, which causes the mouse controls not to work
i noticed many tests provided on forum an blog posts didn't detect touch capacity properly, because they often check if touch APIs exist, which seems to be true in some Opera and Firefox browsers (i read some posts about people having the same problem with Chrome, mine works well)
i ended up using this test, which is far from perfect but does the job for now :
!(window.screenX != 0) && ('ontouchstart' in window || 'onmsgesturechange' in window);
i have no more problems, but this solution should be tested on many devices and the isTouch test must be improved
also, i got a bug in the zoom (line 90) while using latest version of jQuery, which i fixed by unchaining the two listeners as follows :
this.mousedown(zoomMethods._mousedown); // what ? chaining bug ?
this.click(zoomMethods._tap);

Avoid auto scrolling to the top after aligning with an anchor properly

I have one of those issues that I have been staring at and researching, but can't figure out.
I am loading a listing page with a hash: (example URL)
service_page1.php?u=XX01-TR000016#000016
I have my anchors set: (Example Code)
<div class="b_list_normal_row_ws">
<a name="000013"></a>
<div class="b_list_row_item_But"><img example />
</div>
</div>
Currently I am testing within Safari (latest version) on a Mac. When I load the page, it scrolls to the proper spot for the anchor and then scrolls to the top. I have read other threads about stopping the auto-scroll to the top, but not found one (as of yet) that solves my problem.
Update: I have been working to figure out what could be causing this issue. I have since discovered that if I remove ALL included js files, then the anchors work just fine. However, if I include even the jquery file, then they stop working. The search continues...

Upon serious amounts of testing, it turns out that Safari (6.0.4) is the cause of the problem.
Tested with different browsers, Safari is the only one that is having the problem with the anchors.
With Safari, there is some form of conflict between javascript and the anchors, though it is out of my control. I have updated all my scripts to the latest versions also.
Browsers tested, all the latest possible versions:
Safari (Windows)
Firefox (Windows)
Chrome (Windows)
IE 9
Firefox (OS X Latest)
Chrome (OS X Latest)
Safari (iOS)
Chrome (iOS)
Safari (OS X Latest)* The problem child
UPDATE (June 11):
I have just tested the same site with the new version of OS X and Safari in the public preview and it seems that they fix this issue with the next release. Hopefully, they don't break it again before then.

Jquery sliding DIV not working in browser compatibility issue

I am trying to implement a sliding div over pdf (Information : Pdf is Shown using iFrame). Its working on Mozilla Firefox, Chrome but its not working on Internet Explorer, Safari :(. Here is the jsFiddler Link. Click Here
Will any 1 let me know what should i do to work in all browsers.

try this tutorial
http://www.learningjquery.com/2009/02/slide-elements-in-different-directions
I think decent css is the key here

jQuery not working in Safari

I've got this jquery script, it seems to be working in other browser, but it doesnt work at all in Safari. Does anyone know why this might be happening? Its supposed to be accessed from an iphone.
url: http://connectsr.org.nz/calendar/
thanks

in safari 5 on windows 7 this works, but not with my iphone (iphone 4 with newest ios, not jailbreaked). i think this is because if you click and drag to scroll the colums, the safari on the iphone tries to scroll the site (which is what it normally does when you klick and drag on a website)

Jquery script is not working on the mobile perfectly. Instead of jquery, you can use jquery mobile (http://jquerymobile.com/)