Solved

shaking word

Posted on 2009-07-07
6
297 Views
Last Modified: 2012-05-07
hi....

can anyone please give me right code for shaking these 'hello world' while i put the mouse over it!

find the code below please!

thank you

<html>
hello world
</html>

Open in new window

0
Comment
Question by:ferman-k
  • 2
  • 2
  • 2
6 Comments
 
LVL 21

Expert Comment

by:Tapan Pattanaik
ID: 24794642
hi ferman-k,

                  Follow the step by step procedure in the given below link and it will display shaking text in the browser.

Shaking Text  :

http://www.hypergurl.com/shakingtext.html


Thanks.

Tapan Pattaniak
0
 
LVL 12

Expert Comment

by:Chad Haney
ID: 24797961
Here is a simple example
<html>
<head>
<script type="text/javascript">
var go=true;
var left = true;
var shakeMe;
function shakeText(doIt, who){
	go=doIt;
	shakeMe=who;
	shake();
}
function shake(){
	if(go){
		var pos = shakeMe.style.left;
		pos = pos.substring(0,pos.indexOf("px"));
		if (left){
			shakeMe.style.left = parseInt(pos) + 1;
			left=false;	
		}else{
			shakeMe.style.left = parseInt(pos) - 1;	
			left=true;
		}
		var t = setTimeout("shake()",50);
	}
}
</script>
</head>
<body>
<span style="position:relative;left:0;" onmouseover="shakeText(true, this)" onmouseout="shakeText(false, this)">Hello</span>
</body>
</html>

Open in new window

0
 

Author Comment

by:ferman-k
ID: 24798560
i have used same code you sent and the hello word was not makng any move at all.. what do you think the problem might be? please!

please find the included code

<html>
<head>
<script type="text/javascript">
var go=true;
var left = true;
var shakeMe;
function shakeText(doIt, who){
        go=doIt;
        shakeMe=who;
        shake();
}
function shake(){
        if(go){
                var pos = shakeMe.style.left;
                pos = pos.substring(0,pos.indexOf("px"));
                if (left){
                        shakeMe.style.left = parseInt(pos) + 1;
                        left=false;     
                }else{
                        shakeMe.style.left = parseInt(pos) - 1; 
                        left=true;
                }
                var t = setTimeout("shake()",50);
        }
}
</script>
</head>
<body>
<span style="position:relative;left:0;" onmouseover="shakeText(true, this)" onmouseout="shakeText(false, this)">Hello</span>
</body>
</html>

Open in new window

0
Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

 
LVL 21

Accepted Solution

by:
Tapan Pattanaik earned 500 total points
ID: 24798900
hi ferman-k,

                     
Check this code, which will display shaking "hello word"

Thanks.


 <script type="text/javascript" >
//configure message
message="Hello word"
//animate text in NS6? (0 will turn it off)
ns6switch=1
 
var ns6=document.getElementById&&!document.all
mes=new Array();
mes[0]=-1;
mes[1]=-4;
mes[2]=-7;mes[3]=-10;
mes[4]=-7;
mes[5]=-4;
mes[6]=-1;
num=0;
num2=0;
txt="";
function jump0(){
if (ns6&&!ns6switch){
jump.innerHTML=message
return
}
if(message.length > 6){
for(i=0; i != message.length;i++){
txt=txt+"<span style='position:relative;' id='n"+i+"'>"+message.charAt(i)+"</span>"};
jump.innerHTML=txt;
txt="";
jump1a()
}
else{
alert("Your message is to short")
}
}
 
function jump1a(){
nfinal=(document.getElementById)? document.getElementById("n0") : document.all.n0
nfinal.style.left=-num2;
if(num2 != 9){
num2=num2+3;
setTimeout("jump1a()",50)
}
else{
jump1b()
}
}
 
function jump1b(){
nfinal.style.left=-num2;
if(num2 != 0){num2=num2-3;
setTimeout("jump1b()",50)
}
else{
jump2()
}
}
 
function jump2(){
txt="";
for(i=0;i != message.length;i++){
if(i+num > -1 && i+num < 7){
txt=txt+"<span style='position:relative;top:"+mes[i+num]+"'>"+message.charAt(i)+"</span>"
}
else{txt=txt+"<span>"+message.charAt(i)+"</span>"}
}
jump.innerHTML=txt;
txt="";
if(num != (-message.length)){
num--;
setTimeout("jump2()",50)}
else{num=0;
setTimeout("jump0()",50)}}
</script>
 
 
<div id="jumpx" style="color:green"></div>
<script type="text/javascript">
if (document.all||document.getElementById){
jump=(document.getElementById)? document.getElementById("jumpx") : document.all.jumpx
jump0()
}
else
document.write(message)
</script>

Open in new window

0
 
LVL 12

Expert Comment

by:Chad Haney
ID: 24798922
Did you have position defined as either absolute or relative and left defined?
0
 

Author Closing Comment

by:ferman-k
ID: 31600606
in fact it was not what i wanted, but i consider it better,, the word is not shaking, it wiggling instead, which it lovely and i like more. ;-)

i appreciate your guide, thank you
0

Featured Post

Active Directory Webinar

We all know we need to protect and secure our privileges, but where to start? Join Experts Exchange and ManageEngine on Tuesday, April 11, 2017 10:00 AM PDT to learn how to track and secure privileged users in Active Directory.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article discusses four methods for overlaying images in a container on a web page
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

820 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question