I'm working on a game I want that when I press the keyboard button once, jump on my gaming character until the given loop condition is incorrect. But now the problem is that my character is jumping as well as pressing the keyboard button.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--AnimationUsingKeyboard.html-->
<html lang="EN" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/xml; charset=utf-8"/>
<title>AnimationUsingKeyboard.html</title>
<link rel="Stylesheet" type="text/css" href=""/>
<script type="text/javascript" src="AnimationUsingKeyboard.js">
//<![CDATA[
//]]>
</script>
</head>
<body onload="init()">
<h1>Animation Using Keyboard Input</h1>
<div id="outline" style="position:absolute;
width:50px;
height:50px;
top:100px;
left:5px;">
<img id="krizen" src="krizen1.png" width="50px" height="50px" alt="krizen.png"/>
</div>
<div id="output">
</div>
</body>
</html>
var imgList=new Array("krizen1.png",
"krizen2.png",
"krizen3.png",
"krizen4.png",
"krizen5.png",
"krizen6.png",
"krizen7.png",
"krizen8.png"
);
var outline;
var krizen;
var jump;
function init(){
outline=document.getElementById("outline");
krizen=document.getElementById("krizen");
document.onkeydown=keyListner;
}
function keyListner(e){
if(!e){
e=window.event;
}//end if
if(e.keyCode==38){
jump=parseInt(outline.style.top);
while(jump!=70){
outline.style.top=jump+"px";
jump-=5;
}//end while
}//end if
}//end keyListner function
You could try to set a variable; lets say Pressed to 1 if the key is pressed, and if its released it turns Pressed to 0 and the loop checks if Pressed===1
Related
The dleMonitor and script in the code below are not working. Why? I think that timeout block need to be set in template file. I just want to make logout from profile after timeout. Help me please.
<!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"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
<title>
<ui:insert name="title">CMS</ui:insert>
</title>
<link rel="stylesheet" type="text/css" href="/cms/css/style.css"/>
<h:outputScript name="jsf.js" library="javax.faces" target="head"/>
<script type="text/javascript">
var timeOut = 1000 * 60 * 1; // 30 minutes
var lastActivity = new Date().getTime();
var checkTimeout;
checkTimeOut = function(){
if(new Date().getTime() > lastActivity + timeOut){
window.location.replace('http://sidanmor.com');
}else{
window.setTimeout(checkTimeOut, 1000); // check once per second
}
}
</script>
</h:head>
<body>
<p:idleMonitor timeout="5000" listener="#{LogoutServlet.service()}"
onidle="PF('alertExpire').show();">
</p:idleMonitor>
<p:idleMonitor widgetVar="idle" timeout="300" onidle="alert('OK')" />
<div id="minHeight"></div>
<div id="outer">
<div id="clearheader"></div>
<div id="nav">
<ui:include src="/templates/#{mainCms.edition}/nav.xhtml" />
</div>
<div id="content">
<ui:insert name="content" > Content area. </ui:insert>
</div>
<div id="clearfooter"></div>
</div>
<div id="footer">
www.com.ua
</p>
</div>
<div id="header">
<a href="/cms" class="logo" title="ом">
<span class="main">г</span>
</a>
</div>
</body>
</html>
I'll assume that this code
window.location.replace('http://sidanmor.com');
logs you out from the system. So here
var checkTimeout;
checkTimeOut = function(){
if(new Date().getTime() > lastActivity + timeOut){
window.location.replace('http://sidanmor.com');
}else{
window.setTimeout(checkTimeOut, 1000); // check once per second
}
}
you are assigning the function into checkTimeout variable without executing it, so adding this
checkTimeout(); // runs the function
will execute the function and run it again every second.
I am trying to play a video in IE9 and earlier versions. For that I used activeX plugin to load VLC Media Player (that is my basic requirement).
When I tried to execute my code I got an error thrown:
Unable to get value of the property 'playlist': object is null or undefined
My code as follows:
<!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=iso-8859-1" />
<title>VLC API</title>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script>
$(document).ready(function(){
play();
displayPlugins();
$(function(){
$("#vlc").css({ "width": "400px", "height": "300px" });
});
});
function play()
{
var vlc=document.getElementById("vlc");
alert("play video");
var url="rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov";
var options=new Array(":aspect-ratio=4:3","-rtsp-tcp");
var id= vlc.playlist.add(url,"",options);
vlc.playlist.playItem(id);
}
function displayPlugins()
{
alert("plugins");
var player="<object type='application/x-vlc-plugin' id='vlc' width='300' height='225' classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase='http://activex.microsoft.com/controls/vb5/comdlg32.cab'></object>";
$("#video_holder").html(player);
}
</script>
</head>
<body>
<div id="video_holder" style="border:1px solid #00FF33; height:350px;"></div>
</body>
Can anybody help me where I'm getting wrong?
You are doing:
var vlc=document.getElementById("vlc");
But on HTML, you have
<div id="video_holder" style="border:1px solid #00FF33; height:350px;"></div>
So in theory you want:
var vlc=document.getElementById("video_holder");
You might have more problems after that, but start here.
Hello again i found a great script that does almost what i want the problem is that its not moving on its own when the page loads can we change it to do that?
The idea was to make scrolling down messages i want to make it to make a loop so il have a message and it will move from top to bottom but it will never stop moving like a marquee
thanks in advance!
<!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>Untitled Document</title>
<script type="text/javascript">
scrollStep=1
timerUp=""
timerDown=""
function toTop(id){
document.getElementById(id).scrollTop=0
}
function scrollDivDown(id){
clearTimeout(timerDown)
document.getElementById(id).scrollTop+=scrollStep
timerDown=setTimeout("scrollDivDown('"+id+"')",10)
}
function scrollDivUp(id){
clearTimeout(timerUp)
document.getElementById(id).scrollTop-=scrollStep
timerUp=setTimeout("scrollDivUp('"+id+"')",10)
}
function toBottom(id){
document.getElementById(id).scrollTop=document.getElementById(id).scrollHeight
}
function stopMe(){
clearTimeout(timerDown)
clearTimeout(timerUp)
}
</script>
<style>
#display{
width:200px;
height:150px;
overflow:hidden;
text-align:left;
border:1px solid black;
}
</style>
</head>
<body>
Top
ScrollDown
Scroll Up
Bottom
<div id="display">
<b>LAYER CONTENTS</b>
<P>Dummy Text<P>Dummy Text<P>Dummy Text<P>Dummy Text
<P>Dummy Text<P>Dummy Text<P>Dummy Text<P>Dummy Text
<P>Dummy Text<P>Dummy Text<P>Dummy Text<P>Dummy Text
<P>Dummy Text<P>Dummy Text<P>Dummy Text<P>End
</div>
</body>
</html>
i want to do something like this so it will make a loop:
function scrollDown(id){
clearTimeout(timerDown)
document.getElementById(id).scrollTop+=scrollStep
if (document.getElementById(id).scrollTop=document.getElementById(id).scrollHeight){
document.getElementById(id).scrollTop=0
}
}
<div id="display" onmouseout="scrollDown('display')" onmouseover="stopMe()">
and under this div its the messages
Try window.onload around your code you want to run at page load.
window.onload = function() { ...yourcode... };
You can try to wrap your code into the following way into the
windows.load=function(){//Your Code}
Since the script is loading before the document is loaded
<script type="text/javascript">
window.load = function(){
scrollStep=1
timerUp=""
timerDown=""
function toTop(id){
document.getElementById(id).scrollTop=0
}
function scrollDivDown(id){
clearTimeout(timerDown)
document.getElementById(id).scrollTop+=scrollStep
timerDown=setTimeout("scrollDivDown('"+id+"')",10)
}
function scrollDivUp(id){
clearTimeout(timerUp)
document.getElementById(id).scrollTop-=scrollStep
timerUp=setTimeout("scrollDivUp('"+id+"')",10)
}
function toBottom(id){
document.getElementById(id).scrollTop=document.getElementById(id).scrollHeight
}
function stopMe(){
clearTimeout(timerDown)
clearTimeout(timerUp)
}
};
</script>
OK here i found a solution that worked perfect!!
http://jscroller2.markusbordihn.de/
How do you assign a class dynamically to a paragraph (via javascript/CSS) IF the paragraph contains the wording "Time Recorded:"?
You'll notice that I have manually assigned the paragraph with class class="dyncontent".
However, I'd like to dynamically assign this class to any paragraph tag which contain the words "Time Recorded:".
<!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=iso-8859-1" />
<title>Untitled Document</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script type="text/javascript">
if (document.all || document.getElementById){ //if IE4 or NS6+
document.write('<style type="text/css">')
document.write('.dyncontent{display:none;}')
document.write('</style>')
}
</script>
<div class="right">
<ul>
<li class="say agent public">
<p>Description line 1</p>
<p class="dyncontent">Time Recorded: 5MIN(S)</p>
<p>Another description line</p>
</li>
</ul>
</div>
</body>
</html>
You could use jQuery:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
$(function(){
$("p:contains('Time Recorded:')").addClass('dyncontents');
});
</script>
$("p").each(function(ele) {if (this.html().indexOf('TimeRecorded') > 1) {$(this).addClass('dyncontent'))}});
I'd do indexOf because it will match easier than innerText
var allP = document.getElementsByTagName('p'),
pLength = allP.length;
while(pLength--){
if(allP[pLength].innerHTML.indexOf('Time Recorded') != -1){
allP[pLength].addClass('dycontents');
}
}
To explain: first you get all the <p> in the document. Then you loop through them. If any of them contain text of Time Recorded you add your class to it.
The following is solution without Jquery
o = document.getElementsByTagName('p');
for (i = 0; i < o.length; i++) {
if (o[i].innerText.indexOf('Time Recorded:') != -1) {
o[i].className = 'theClassYouWant';
}
}
I have just written my first app in phonegap that simply replaces a text string on the screen each time you activate a link.
The original string stays where it is and the new string is written over the top. If you then activate the link again the second string is replaced with a new one but still over the top of the first string.
I have tried clearing the variable to fix this but no luck.
Is this a platform limitation or am i doing something wrong?
Code is below
<!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>Untitled Document</title>
</head>
<body onload="newIdea()">
<h1 class="h1">First Love</h1>
<p>Have you ever? </p>
<h3><div id="ideaDiv">Nothing</div></h3>
Let's Do it
No Thanks
<script type="text/javascript">
var ideas=new Array(); // regular array (add an optional integer
ideas[0]="Kissed someone in the rain"; // argument to control array's size)
ideas[1]="Eaten peking duck";
ideas[2]="Stood naked in the open";
function newIdea(){
var idea = "";
var idea = ideas[Math.floor(Math.random()*ideas.length)];
var ideaSpace = document.getElementById("ideaDiv");
ideaSpace.innerHTML=idea;
var ideaLink=document.getElementById("ideaLink");
var linkCreate="http://www.google.com/calendar/event?action=TEMPLATE&text=" + idea + "&dates=20120101/20120102&details=&location=&trp=false&sprop=&sprop=name:";
ideaLink.href=linkCreate;
}
</script>
</body>
</html>
Thanks
Simon
I have no experience with phonegap, but in the past I found some problems trying to set innerHTML in xhtml documents, it don't check if the string you are using causes the document to still a valid xml and just throws an error, to achieve the same effect try:
<!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>Untitled Document</title>
</head>
<body onload="newIdea()">
<h1 class="h1">First Love</h1>
<p>Have you ever? </p>
<h3><div id="ideaDiv">Nothing</div></h3>
Let's Do it
No Thanks
<script type="text/javascript">
var ideas=new Array(); // regular array (add an optional integer
ideas[0]="Kissed someone in the rain"; // argument to control array's size)
ideas[1]="Eaten peking duck";
ideas[2]="Stood naked in the open";
function newIdea(){
var idea = "";
var idea = ideas[Math.floor(Math.random()*ideas.length)];
var ideaSpace = document.getElementById("ideaDiv");
//ideaSpace.innerHTML=idea;
ideaSpace.removeChild(ideaSpace.firstChild);
ideaSpace.appendChild(document.createTextNode(idea));
var ideaLink=document.getElementById("ideaLink");
var linkCreate="http://www.google.com/calendar/event?action=TEMPLATE&text=" + idea + "&dates=20120101/20120102&details=&location=&trp=false&sprop=&sprop=name:";
ideaLink.href=linkCreate;
}
</script>
</body>
</html>