|
JavaScript - Helping Moving User Info
This is what I have:
Code: <script type="text/javascript">
$(document).ready(function(){
$('#add').click(function() {
alert ('test')
});
$("form#exercise").submit(function() {
// we want to store the values from the form input box, then send via ajax below
var activity = $('#activity').attr('value');
$.ajax({
type: "POST",
url: "newActiveProc.php",
data: "activity="+ activity +"&func=search",
success: function(msg){
$("span#results").html(msg);
}
});
return false;
});
});
</script>
Instead of alerting the user, I want to send their choice to the a table on the same page. Does anyone have any idea of how I might do this. I've posted three threads in the ajax forum with no response. Similar TutorialsHey everybody, what regular expression do i have to use to get the 2 last elements of a user agent? eg in firefox how can i get : Mozilla/5.0 (X11; Linux i686; rv:7.0.1) Gecko/20100101 Firefox/7.0.1 Firefox & 7.01 ? thanks! Hi, I am trying to write a small javascript program where I can call the following two functions and store information which a user enters. The problem is if I call the function a second time to add more information the array gets overwritten. info () insert (name, surname, favouriteColour) function info () { name = prompt ("Please enter your name."); surname = prompt ("Please enter your surname."); favouriteColour = prompt ("Please enter your favourite colour."); } function insert (name, surname, favouriteColour) { var info = new Array (); info.name = name; info.surname = surname; info.favouriteColour = favouriteColour; return info }; Help is really appreciated.. hi, I am following the tutorial on Windows Live App API from he http://isdk.dev.live.com/ISDK.aspx?c...ncepts&index=0 and I have added my Client ID got a login system working and allowing information to be passed through but I cannot display the user that's currently logged in, here is my page: link: http://www.trialsevolution.co.uk/app/ code: 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>
<title>Greeting the User Test page</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="https://js.live.net/v5.0/wl.js" type="text/javascript"></script>
<script type="text/javascript">
var APPLICATION_CLIENT_ID = "000000004805DA23",
REDIRECT_URL = "http://www.trialsevolution.co.uk/app/home.html";
WL.Event.subscribe("auth.login", onLogin);
WL.init({
client_id: 00000000000000,
redirect_uri: "http://www.trialsevolution.co.uk/app/home.html",
response_type: "token"
});
WL.ui({
name: "signin",
element: "signInButton"
});
function greetUser(session) {
var strGreeting = "welcome";
WL.api(
{
path: "me",
method: "GET"
},
function (response) {
if (!response.error) {
strGreeting = "Hi, " + response.first_name + "!"
document.getElementById("greeting").innerHTML = strGreeting;
}
});
}
function setMeImage(token) {
var imgHolder = document.getElementById("meimg"),
imgTagString = "";
if (token != null) {
var url = "https://apis.live.net/v5.0/me/picture?oauth_token=" + escape(token);
imgTagString = "<img src='" + url + "' />";
}
imgHolder.innerHTML = imgTagString;
}
function onLogin() {
var session = WL.getSession();
if (session){
greetUser(session);
setMeImage(session.access_token);
}
}
</script>
</head>
<body>
<p>Sign in to display a welcome greeting.</p>
<div id="meimg"></div>
<div id="greeting"></div>
<div id="signInButton"></div>
</body>
</html>
i need to make a function that will send a string to my perl script then recieve the answer and set a div innerhtml to the answer.. i plan on sending the string from the div onload as i will have about 30 divs that need changing. Code:
<body>
<div name="example1" onload="javascript:retrieve('getstring1')">my retieved string1</div>
<div name="example2" onload="javascript:retrieve('getstring2')">my retieved string2</div>
</body>
<head>
<SCRIPT language="JavaScript">
function retieve('var') {
}
</SCRIPT>
</head>
im not quite sure where to go with this but i can easily make the perl script do if statements on the string and return the correct string to put into the div. the reason for this is that the string will be changed every couple weeks. there is probably a better way to do this but this would be more appropriate for me I have a while-loop and I need it to make a little delay before each time it starts a new cycle. Code: var rollOn = true;
while(rollOn)
{
//A bunch of statements.
//The loop breaks in case of certain conditions so that "rollOn = false;".
var t = setTimeout("continue", 1000);
} //End while
The problem is that setTimeout doesn't delay for a second before the "continue" statement. For example, when I write: Code: var t = setTimeout("alert("Delay")", 1000);
then it displays the alert box after every cycle of the loop, but still no delay. There are no error messages or anything, I'm not really sure what's the problem, thus I don't know what to do about it. Any ideas? What is wrong with my code? I am trying to move a div and it wont work at all. Also my little <a> fix is really sloppy. Could I have some help with how I should fix that too? Thanks! Code: <html>
<head>
<script type="text/javascript">
var obj = document.getElementById("object");
var x = parseInt(obj.style.left);
var y = parseInt(obj.style.top);
function right(){
obj.style.left = "" + (x + 1) + "";
}
function left(){
}
</script>
</head>
<body>
<a href="" onclick="right();">
<div id="container" style="position:absolute; top:100px; left:50%; margin-left:-400px; width:800px; height:600px; border:3px solid #808080;">
<div id="object" style="position:relative; top:559; left:379; background-color:#CCCCCC; width:40px; height:40px; border:1px solid #696969;">
</div>
</div>
</a>
</body>
</html>
Hello, I'm newbie in javascript, but i want to make an moving image. In time it should change to other image with other button. Also it could be changed by user. The change should be dynamic like moving from left to right. ^^ Any advices, tutorial links or smthing.. Thx I'm trying to create something like: http://www.deliciouslysortedibiza.com/ But I want the links to move like it does in there. Does anyone know the easiest way I could achieve this? Since I'm fairly new to Javascript and all. Thanks ! Hi there folks. I am a bit stuck with a little code. I am making a online yearbook entry and I wanted an image of myself animate/move from the top left hand to the bottom right of the screen. I also wanted to allow people reading it the option to change bg colour and text size - but I have managed to do those. The difficulty I am having is with moving the image, could anybody suggest any simple codes because I am new to this and don't want my head spinning before I go any further! Any help is greatly appreciated. Hi, I'm noob , but i have nice idea i want to do it but i can't .. i tried many ways to do it .. but didn't work any of them .. the idea is move the foot to room no.1 .. but i want to see the foot moving on the red line to the room like this pic : Hello everyone. I am trying to make a flag with css and then move it with javascript. Code: <html>
<head>
<title>Flag</title>
<link rel="stylesheet" type="text/css" href="flag3.css" />
<script language="javascript">
Hmove=-100;
function moveObjRight(obj)
{
obj.style.left=Hmove;
Hmove+=4;
if(Hmove<900)
window.setTimeout("moveObjRight(" +obj.id+ ");", 0);
}
</script>
</head>
<body>
<h1>The flag of ___ by www</h1>
<div id="bar3">
<div id="bar2">
<div id="bar1">
</div>
<br />
<br />
<br />
<br />
</div>
<br />
<br />
<br />
<br />
</div>
<script language="JavaScript">
moveObjRight(bar3);
</script>
</body>
</html>
This is my code. The image is moving to the right, but i want it bounce from side-to-side in the browser window. Any help will be appreciated. Thank you. I already looked at this http://codingforums.com/showthread.p...ht=moving+text thread and I know it's similar. I just don't know what I am doing wrong. My css puts the text where it needs to go, then the script is supposed to alter it's pixel position and so it should move, right? Code: <html>
<head>
<style>
item1 {position: absolute; left:20px; top:280px;}
item2 {position: absolute; right:20px; top:280px;}
</style>
</head>
<body>
<item1 id="item1" >item1</item1>
<item2 id="item2" >item2</item2>
<script type="text/javascript">
var i=0; var j=0;
var obj1=document.getElementById(item1);
var obj2=document.getElementById(item2);
obj1.style.visibility="visible";
obj2.style.visibility="visible";
//if (typeof obj1.style.left!="undefined" && obj2.style.right!="undefined")
//{
//loop from ParseInt to coordinates in center of screen
for (i=0;i<100;i++)
{
obj1.style.left=parseInt(obj.style.left) + i + "px";
document.write("<item1 id="item1">item1</item1>");
document.close();
}
//for (j=0;j<100;j++)
// {
// obj2.style.right=parseInt(obj2.style.right) + j + "px";
// document.write("<item2 id="item2" >item2</item2>");
// }
alert(i);
//}
</script>
</body>
</html>
Am I anywhere close? I am trying this on IE6 (I only have Windows 2000) and on Firefox 3.5.3. My code is: Code: <html>
<head>
<script type='text/javascript'>
winx=220
winy=176
self.resizeTo(winx,winy);
</script>
<img id="default"
style="z-index: 0;left: 0; position: absolute; top: 0px"
height=32 width=32 align=baseline border=0 hspace=0 src='save.gif'></p>
<script type="text/javascript">
document.getElementById("default".style.top = '0px';
document.getElementById("default".style.left = '0px';
</script>
The image shows up, but it doesn't move. I can't seem to find out what I'm doing wrong. Edit: Finally spotted it, I was missing a ")" ._. I am trying to find some examples of something I know I have seen in the past, but I am unable to put together a search that is coming up with anything. What I have is a div of content that I need to always be visible on the screen. The page needs to be scrolled to read through it all so I need a way for the div to move down the page as I scroll. Can anyone point me in the right direction? Hello. I am getting to learn JavaScript, and as for my first personal project, I would like to have a page with some text on it and when the user scrolls, a div containing a picture will move with the user when they scroll. I have found a solution, however, I do not like it. Code: <html>
<head runat="server">
<title>Test</title>
<link type="text/css" href="Main.css" rel="Stylesheet" />
</head>
<body class="mainbackground">
<div id="group">
<div id="sizer" class="sizeholder"></div>
<div id="image" class="image"></div>
</div>
<form id="form1" runat="server">
<div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
</form>
<script type="text/javascript" >
window.onload = function () {
onscroll = function () {
var scrollevel = document.body.scrollTop;
if (scrollevel == 0) {
if (window.pageYOffset)
scrollevel = window.pageYOffset;
else
scrollevel = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
}
scrollevel = scrollevel + 250;
document.getElementById("sizer").style.height = scrollevel + 'px';
}
}
</script>
</body>
</html>
As you can see, it works by getting the scroll position and adding 250, to a height property-element above the image div. I have tried to use document.getElementById("image").style.top = scrollevel + 'px', but it does not work. Any ideas??? Hi Guys, seen some pages who give alerts or Warnings mentioning that i'm moving away from my webpage. Best example is hotmail when you are on the compose mail screen and when click another link it is asking for confirmation. Can you one please shed some light on how to do this. Your help is greatly appreciated. Cheers Dileep Hey guys, I was trying to make a Javascript game that moves an image across the screen randomly. Instead of executing properly, it just shows the image's starting point, and stops. No movement. Is there anyway I could fix this? Thanks, Fizz. Code: <html>
<head>
<title>Image Mover</title>
<style>
DIV.movable { position:absolute; }
</style>
</head>
<script language="javascript">
function Start() {
var x = 5; //Starting Location - left
var y = 5; //Starting Location - top
var dest_x = Math.floor(Math.random()*650); //Ending Location - left
var dest_y = 500; //Ending Location - top
var interval = 10; //Move 10px every initialization
moveImage();
}
function NewDest() {
var x = 5; //Starting Location - left
var y = 5; //Starting Location - top
var dest_x = Math.floor(Math.random()*650); //Ending Location - left
var dest_y = 500; //Ending Location - top
var interval = 10; //Move 10px every initialization
moveImage();
}
function moveImage() {
//Keep on moving the image till the target is achieved
if(x < dest_x) x = x + interval;
if(y < dest_y) y = y + interval;
//Move the image to the new location
document.getElementById("ufo").style.top = y+'px';
document.getElementById("ufo").style.left = x+'px';
if ((x+interval < dest_x) && (y+interval < dest_y)) {
//Keep on calling this function every 100 microsecond
// till the target location is reached
window.setTimeout('moveImage()',30);
if (x == dest_x) && (y == dest_y) {
NewDest();
}
}
}
</script>
<body onload="Start()">
<div id="ufo" class="movable">
<img src="Mouse.jpg" alt="mouse" WIDTH = 30/>
</div>
</body>
</html>
I have a blog with a two-column setup... a sidebar and a main section for posting articles, but encapsulated in a div wrap. I am creating a mobile site and want to: 1) remove/hide the sidebar 2) move the main section to the center for easy reading My issue is that I have tried CSS without success in accomplishing BOTH tasks. I easily can hide the sidebar using various methods, but the main section will not move to the center of the wrap, presumably because the sidebar is still there but not visible. So I went the JavaScript route instead with the following: Code: <script type="text/javascript">
<!--
if (screen.width <= 699) {
var wrap = document.getElementById('wrap');
var sidebar = document.getElementById('sidebar');
wrap.removeChild(sidebar);
wrap.style.background = "inherit";
}
-->
</script>
Now my questions is... since the element is now removed, how do I move the main section to the center? I tried grabbing the main section with its id and floating it left (just to play around and see if it would move) and that didn't do anything. Any help would be appreciated. <html> <head> <meta http-equiv='Content-Type' content='text/html; charset=utf-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript'> <script type = 'text/javascript'> function unselectall(form) { var i=0; for(i=0;i<=15;i++) { tdname = 'invbox'+i; if (document.getElementById && document.getElementById(tdname).style) { document.getElementById(tdname).style.borderColor = '#000000'; form.selected.value = 0; } else { i=20; } } } function selectthis(form, pos) { unselectall(form); var tdname = 'inventory'; document.getElementById(tdname).style.borderColor = '#ffff00'; form.selected.value = form.position1.value; } </script> </head> <body> <form id='inventorytable' method='post' action='addflowerlight.php'> <table id='inventory' border=1> <tr> <td id = 'invbox1' ><img src = 'images/Lights/6inv.jpg' onclick="selectthis('inventorytable', 1);"><input type = 'text' id = 'position1' value='6'></td></tr></table> <input type ='text' id='selected'> <input type ='submit' value='Equip Light'> </form> </body> </html> What am I doing wrong? The onclick wont trigger. |
|||||||