I am very new to using Intel's XDK, I already have a web app that I need to convert to an android app. I have tested the html web app thoroughly and so far, it works perfectly in the browser. The problem is that when I imported it to the XDK, it doesn't seem to work on the emulators. I searched everywhere and no one else seems to have the same problem, so it must be I'm missing something. I know you have to insert an extra javascript (which I already did) but so far, it still doesn't work. Can anybody here point me to the right direction? Thank you in advance.
My code:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width target-densitydpi=device-dpi initial- scale=0.1 maximum-scale=0.5 user-scalable=0" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge" />
<title>King</title>
<style>
html {
height:100%;
}
body {
background-color: #000000;
margin:0;
height:100%;
}
</style>
<meta name="viewport" content="user-scalable=yes, width=1024" />
<script src='intelxdk.js'></script>
<script type="text/javascript">
/* Intel native bridge is available */
var onDeviceReady=function(){
//hide splash screen
intel.xdk.device.hideSplashScreen();
};
document.addEventListener("intel.xdk.device.ready",onDeviceReady,false);
</script>
</head>
<body>
<div style ="margin:auto;width:1024px;height:768px">
<div id="king_hype_container" style="position:relative;overflow:hidden;width:1024px;height:768px;">
<script type="text/javascript" charset="utf-8" src="King.hyperesources/king_hype_generated_script.js?7046"></script>
</div>
</div>
</body>
</html>
Maybe I'm putting the intel xdk in the wrong place in javascript?
Do what #rscohn2 suggests (make that "king" script is local to your project, avoid loading it over the network if at all possible), but also take a look at this "beefier" template which I've provided to people who are trying to turn a web app into a webview app. There are lots of comments and console.log messages to help you figure out what's going on, but, in essence:
wait for the custom "app.Ready" event to kick off your app
consider when you are loading your third-party and custom JS scripts (see the README)
It probably isn't loading the king_hype_generated_script.js. You could see that by popping up the debugger in the emulator. You can do that by clicking on the bug icon in the top left of the screen and then looking at the messages in the console tab. you probably want to make king_hype_generate_script.js a static file and copy into your project, or use an absolute URL pointing back at your server. Copying it into your project will give you better ability to work offline.
Related
need to be pointed in the right direction regarding writing/running JavaScript in Visual Studio, since I got my feet wet into programming using Visual Basic. I'm in the process of applying for a bootcamp in NYC and part of the application process includes an interview in which I may have to demonstrate a tiny bit of JS. I know it is traditionally run in web browsers but if I can also do it within the familiar environment of the IDE i learned in that would be amazing. (I have Visual Studio versions 2015 and 2019.)
Thanks!
If your just writing some simple JavaScript you want to see in a browser, wrap it in html and name the file index.html, use windows explorer to navigate to the folder holding the index.html wrapper and .js, double click on the index.html and it should run in your browser.
open a text editor and save the following as index.html. script.js is the name of your JavaScript file in the same folder as index.html, you can change the title to whatever you want.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Console demo</title>
<script src="script.js" defer></script>
</head>
<body></body>
</html>
Inside visual studio 2022 you could do the same html wrapper and open a terminal window, navigate to the folder and run ".\index.html"
I'm new to javascript and trying to add this http://codepen.io/jklm313/pen/EarFd great map scrolling effect to my site. Css anf HTML read fine, but the js part doesn't want to work. Even if I put the js code in my html. This is the very typical beginning of my html:
<html>
<head>
<title>title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="style.css"/>
<script src="script.js" type="text/javascript"></script>
</head>
<body>
I've searched for clues, but I can't seam to find the issue, is the code outdated or should I add something more? Thanks in advance
Test and make sure you are getting the js file loaded into the page. One method would be to place at the top of the script.js file :
alert('loaded');
If you get the alert box then you you have the correct path. If not then you know it is likely a path issue. You may need to make sure your file is in the same directory or else specify the directory in the src
I just glanced at the link and notice it is using the jquery library. Go to jquery.com to learn how to include that js file as well
I had a great working PhoneGap mobile web-app project, then my laptop died. I had all the files saved to the cloud, so no trouble with code loss, but now I've been trying to rebuild the project and that's where the trouble is.
I've set the whole thing up again, and it's loading alright, all the html elements are there as coded, but the jQuery Mobile css doesn't seem to be including on any of my pages, given that all I see is a white page with normal underlined blue links. Very unattractive.
Here's the beginning of my code on each page:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css"/>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-1.9.0.js"></script>
Which should be alright, I would think...it worked before, anyway.
What's missing? I'm inclined to think it's somewhere in the configuration rather than the code, give the circumstances.
Should there be some sort of cordova.css file? Because there isn't one, and I thought there used to be. (About to Google that...)
Have you checked that code.jquery.com is in ExternalHosts in your phonegap.plist (or cordova.plist)?
Please try whit this,
https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.1.0/jquery.mobile-1.1.0.min.css
Hope this helps. :)
I am trying to use Google Chrome Frame in my Django app.
Inserting <meta http-equiv="X-UA-Compatible" content="chrome=1"> into the header doesn't do the trick.
Right now, this is what my header looks like:
<head>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>Amuse Me</title>
<link href='/static/style.css' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="/static/jquery-1.6.0.min.js"></script>
<script type="text/javascript" src="/static/base.js"></script>
</head>
Any suggestions?
Your page might be cached as suggested in quirksblog:
Cache
When I was doing research I used one
test page and constantly changed the
tags in the . The problem
was that IE/Frame seemed to be caching
not only the page, but also in which
rendering engine it should be shown.
Therefore a simple page refresh won’t
help you here.
Fortunately Twitter user jdalton came
up with a solution: simply append a
pseudo-query such as ?123 to the page
URL. That bypasses the cache and
forces the browser to re-evaluate the
tags.
Open your code in Google Chrome's developer tools and look for html errors, and check your resource headers.
I'm having a bizarre situation here where my external site files, both JavaScript and CSS, are being interpretted as somehow corrupt on Safari browsers. The same site looks fine in Internet Explorer, but on Safari the javascript and css are being completely ignored. If I look at the files through the Inspector, I can see that Safari views these files as containing junk characters -- either asian symbols or square boxes. When I navigate directly to the files, however, they appear just fine. See the site below, viewed in Safari 5, for an example:
http://amsoell.com/dch/castlemoore
If I embed the same exact CSS or JavaScript into the HTML itself, it renders perfectly. I don't know if this is a server issue or something in my CSS, but I'm at my wits end here.
I checked your website for validation and it's not valid. But the most interesting thing is that your enconding is utf-16le. You should put your encoding to utf-8. Just put the following line in your <head> section:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
Include the charset="utf-8" parameter in your <script> and <link> tags:
<script type="text/javascript" charset="utf-8" src="script.js"></script>
<link rel="stylesheet" type="text/css" charset="utf-8" href="style.css">
The problem can be solved by saving the html page in "Windows-1252 Encoding".