In my iOS App, I would like to display an HTML containing javascript. It is an animated background.
I manage to display the HTML page inside a WKWebView but the javascript background is not displayed. The "Hello World" and the background color of the page is correctly displayed.
Can you help me ? (I don't know neither HTML nor Javascript)
Here is my viewDidLoad in Swift :
var webView = WKWebView()
do {
let testHTML = NSBundle.mainBundle().pathForResource("index", ofType: "html")
let contents = try NSString(contentsOfFile: testHTML!, encoding: NSASCIIStringEncoding)
let baseUrl = NSURL(fileURLWithPath: testHTML!) //for load css file
webView.loadHTMLString(contents as String, baseURL: baseUrl)
} catch let error {
print(error)
}
Here is my HTML file :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Homepage</title>
<!--Add the new slick-theme.css if you want the default styling-->
<link rel="stylesheet" type="text/css" href="css/home_background.css"/>
</head>
<body class="home", bgcolor="#374283">
<section class="canvas-wrap">
<div class="canvas-content"></div>
<div id="canvas" class="gradient"></div>
</section>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<!-- Main library -->
<script src="js/three.min.js"></script>
<!-- Helpers -->
<script src="js/projector.js"></script>
<script src="js/canvas-renderer.js"></script>
<!-- Visualitzation adjustments -->
<script src="js/3d-lines-animation.js"></script>
<!-- Animated background color -->
<script src="js/color.js"></script>
<h1>Hello world!</h1>
</body>
Thank you !