iOS8 Safari's bug? - javascript

guys!
We are developing a realy simple web page.
But, touch events can't work in iOS8's Safari if we use iframe and web clip.
We don't know why.
Hear is our code.
And, we use web clip.
Even if we touch the div(id="hoge"), the alert doesn't appear.
Please help us...
・index.html
<!DOCTYPE html>
<html>
<body>
<div id="hoge">ABC</div>
<script>
document.getElementById("hoge").addEventListener('touchstart', function() { alert('Touch');});
</script>
</body>
</html>
・frame.html
<!DOCTYPE html>
<html>
<body>
<iframe src="./index.html"/>
</body>
</html>

Related

Tab kill function in JavaScript

I'm the one who started JavaScript yesterday.
I made code like this.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<script>
alert('Hello world \nNice to meet you \n');
</script>
</body>
</html>
However, after the code was finished, it was inconvenient to only leave blank pages.
Is there a function in JavaScript that kills the running browser tab?
I use Windows as the operating system and Chrome as the browser.
========
'Window.close();' in the last line of code I added it, but nothing happened.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<script>
alert('Hello world \nNice to meet you \n');
window.close();
</script>
</body>
</html>
window.close() will close the current tab.
Refer this stackoverflow question to get an idea why window.close() doesn't work for you.
And I also suggest you to clear the cache and sessions and try again.

Attribute download on Safari Browser

I was doing a project and I faced an issue with the attribute download: I discovered that it isn't supported by Safari browser (according to documentation).
Here's a snippet:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<a href="http://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon#2.png?v=73d79a89bded&a" download>Press to Download</a>
</body>
</html>
I searched a way to do it with pure Javascript or Angular, but I didn't find nothing. Would be great if someone had a solution.
Try
<a href="http://cdn.sstatic.net/Sites/stackoverflow/img/"
download="apple-touch-icon#2.png?v=73d79a89bded&a">
Press to Download</a>

Play sound on Safari (iOS) and Chrome (Android) using JavaScript

I want to be able to play sound on HTML page using JavaScript when some event happens.
Basically I want to get data from server using AJAX and then if it is something specific, then play sound.
It works great on PC browsers, but I have issues making it work on Safari (iOS) and Chrome (Android). I read that to play sound on Chrome (I guess Safari also), this needs to be triggered by some user event (gesture, click, etc.). So here is my SIMPLIFIED code:
<!DOCTYPE HTML>
<head>
<meta http-equiv="refresh" content="7" />
</head>
<body>
<button onclick="playSound()" id="button">Click me</button>
<script>
window.setInterval(function(){
parent.document.getElementById('button').click();
}, 5000);
function playSound() {
var audio = new Audio('http://www.soundjay.com/button/beep-01a.wav');
audio.play();
}
</script>
</body>
</html>
I thought this workaround will work (trigger click event using JS), but still no sound.
One additional thing is that I want to AJAX code every few seconds and even when phone is BLOCKED. I found this solution (and applied my changes from previous try):
background.html:
<!DOCTYPE HTML>
<head>
<meta http-equiv="refresh" content="3" />
</head>
<body>
<script>
parent.run_function_from_core_page();
</script>
</body>
</html>
In index.html:
<iframe src="background.html" style="display:none;"></iframe>
But again, works great on PC, but no sound on either Chrome mobile and Safari mobile.
Any suggestions? Is that even possible?

Processing working only on Firefox

I'm working on a website in HTML5 CSS3 but I can't make my processing sketch work on other browsers than firefox.
Here is my code:
<!DOCTYPE html>
<html>
<head>
<title>Project</title>
<script type="javascript" src="processing.js"></script>
</head>
<body>
<canvas data-processing-sources="accueil.pde"></canvas>
</body>
</html>
Just answering if someone have the same error than me:
Processing sketchs work only in firefox browser if you're in localhost.
If you want to try it on other browser you need to host your website.

Buttons are not working in Chrome or Firefox

I'm having an issue with a website I've created for a school assignment. As the title says, buttons don't seem to be working in Google Chrome or Firefox. I got it working in IE (the horror), where I have to Allow "Blocked Content." The problem is, I don't know what "blocked content" is referred to..
<button href="#" onclick="switchImage('slideImg')">
Play
</button>
Here I'm using Javascript, but buttons in general don't actually work, for example:
<button>
Click me!
</button>
doesn't show the visual for clicking a button.
Any help would be great!
Use following
<!DOCTYPE html>
<html>
<head>
<script>
function switchImage(str)
{
alert(str);
}
</script>
</head>
<body>
<button onclick="switchImage('slideImg')">Play</button>
</body>
</html>
It is working. You can verify it from http://fiddle.jshell.net/Jd2yP/15/
Add the mark of the web immediately after your Doctype to tell IE to run the page in the Internet security zone.
<!DOCTYPE html>
<!-- saved from url=(0014)about:internet -->

Categories