And once again I am stuck in the learning process. I am trying to animate a background of a site using the help provided here. But I am a little stuck. As I am teaching myself javascript (to replace basic actionscript). I like to write line by line instead of copying an pasting so I can understand how things work.
This is what I have so far:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My Site</title>
<script type="text/javascript">
$(document).ready(function(){
window.alert("function started");
});
</script>
</head>
<body>
</body>
</html>
As you can see the alert window should pop up as the function is started, but it doesn't. Is there a reason why this happens or should I just set up a body onLoad function to handle what I want to do when the page loads?
You forgot to include the jQuery javascript API in your page. It should be included before you use the $() function (which is an alias for the jQuery() function in this case.)
If you check your browser's Javascript console you probably have an exception for trying to use undefined $. (In IE a handy trick while doing web development is to enable the Advanced option for "Display a notification for every script error," but this can get annoying when visiting other sites because lots of developers are lousy about identifying and fixing unhandled JS exceptions! Modern browsers usually use 'F12' (in the US at least), to open the developer tools for debugging Javascript, etc.)
Corrected code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My Site</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function ()
{
window.alert("function started");
});
</script>
</head>
<body>
</body>
</html>
This example uses the Google-hosted jQuery API, but you may also choose to download jQuery from http://jquery.com
Demo
http://jsfiddle.net/dvADs/
You are missing library reference~! like this
<script type='text/javascript' src='//code.jquery.com/jquery-2.0.2.js'></script>
Hope rest feeds your needs :)
Basics: http://jqfundamentals.com/chapter/jquery-basics
JQ CDN: http://jquery.com/download/
$(document).ready(function(){
window.alert("function started");
});
You are not first loading jQuery. jQuery is a library that you are trying to call by using the $. You can download it here: http://jquery.com/download/. Make sure you load jQuery before the javascript code.
Related
I have developed the Bookmarklet for Internet Explorer. It works fine when user load it on main browser page.
The issue is, it does not work on the Pop-Up Window of the application.
Most of my users, open the link inside the main page in pop-up, but the bookmarklet is triggered from Favorite window.
The bookmarklet link is not working in pop-up window.
Is there a way to achieve this ?
Try to use code below may help to solve your issue.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
<title>WhatsApp</title>
</head>
<body>
<script type="text/javascript">
javascript:(function(){open('https://Microsoft.com/','myWindow','toolbar=yes, menubar=yes, resizable=yes, width=650,height=900,top=0,left=1270');})()
</script>
</body>
</html>
I have validated this html. When I open it in a IE browser I cant see any alert. In other browsers I can. Any ideas why this is happening. HTML is valid according to http://validator.w3.org/check.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/1998/REC-html40-19980424/loose.dtd">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>hello</title>
</head>
<body>
<script type="text/javascript">alert("hallo");</script>
<div>Hello</div>
</body>
</html>
If you are opening the file locally in IE, you will a find confirmation message from IE saying
"Allow blocked content"
Click on it and your code will run.
In my site pages, I used a javascript coding for live chat from zopim. This works fine in chrome and Firefox. The live chat window is displaying and can able to chat with that window.
But in IE the chat window is not visible. But when using inspect element in IE it highlights the div for the chat window. I tried some other coding from zopim. But I didn't get the result in IE.
I dont know what is the problem. Anybody can help me to solve this issue for live chat. The coding I used
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sample test zopim</title>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
Sample test Zopim
<!--Start of Zopim Live Chat Script--> <script type="text/javascript">
window.$zopim||(function(d,s){var z=$zopim=function(c){z._.push(c)},$=z.s= d.createElement(s),e=d.getElementsByTagName(s)[0];z.set=function(o){z.set. _.push(o)};z._=[];z.set._=[];$.async=!0;$.setAttribute('charset','utf-8'); $.src='//cdn.zopim.com/?11THLdRhqxNgdgRiWyGwwAv8e4KF6S6G';z.t=+new Date;$. type='text/javascript';e.parentNode.insertBefore($,e)})(document,'script');
</script> <!--End of Zopim Live Chat Script-->
</body>
</html>
It seems to me that its a browser compatibility issue Upgrade and try other IE version hope it works. If the problem is still remain you can communicate with zopim help support team.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
How to detect if JavaScript is disabled?
I need to detect whether javascript is disabled in browser.
To do so I have put an iframe inside the document and refreshing the page in a interval of 10sec. Once script is disabled, it has to redirect the top parent with javascript error URL. Here is my code for iframe:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<base href="http://localhost/test/" target="_top" />
<noscript>
<meta http-equiv="refresh" content="1; URL=http://localhost/test/javascript_error.php" />
</noscript>
<meta http-equiv="refresh" content="10" />
<title>Detect Script</title>
</head>
<body style="text-align:center;">
Detecting whether javascript script is enabled/disabled in the browser.
</body>
</html>
I'm adding the tag to the content of an iframe html and a redirect meta tag, which should load to the top parent location.
Any idea why this does not work?
or how do i get this thing to work?
Thanks
The base tag affects only elements with URLs that appear as the content of an attribute designated to have a URL value, such as href.
The constructive approach to dealing with JavaScript enabled/disabled is to first design a page assuming that JavaScript is disabled, then add JavaScript in a non-obtrusive way.
UPDATE: I see what you are trying to do. The base tag will only work with links. Since this only is done when JavaScript is disabled, the href of the iframe cannot possibly change and you cannot possibly 'programmatically click' a link which may reference to that JavaScript error page, there is really no possible solution using base. Refer to my solution below.
The reason that your code doesn't work is because most browsers would not render 2 <meta http-equiv="refresh"> tags separately.
So instead of writing <meta http-equiv="refresh" content="10" />, just write:
<script type="text/javascript">
setTimeout(function () {
window.location.reload();
}, 10000);
</script>
I'm having a problem with Javascript not executing when placed in the HEAD section of an HTML page in the Safari browser. It works fine in IE, Chrome and Firefox, but with Safari I have to move it down to between the and tags.
Anyone know if this is a known issue?
PS. The HTML and Javascript is contained in .PHP files, if that makes a difference.
Update:
Code I'm using to test:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link href="style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
alert("In HEAD Tag");
</script>
</head>
<body>
<div id="innerthumbcontainer">
Test
</div>
</body>
</html>
If I open the page containing this directly it seems to work. But as soon as I load this into a DIV from another page it does not fire in Safari. In all the other browsers it does work though.
I think I would have heard about it if that was a general problem, you probably have a syntax error in your HTML or something, which for some reason makes Safari give up. Post your code, preferably the HTML output, and we'll have a chance of telling you what is wrong.
Edit: As far as I understand you are trying to use a complete HTML page as content for a div, you really can't do that. Depending on what exactly you are trying to achieve you could either use an iframe, or you could cut out the html, header and body tags.