Fourni par Blogger.

dimanche 11 août 2013

Text dance on page

Javascript Code: Text dance on page
An excellent effect on texts. They are dancing and shaking like a wave.


<script language="JavaScript1.2">
//configure message
message="Welcome to http://javascriptcodefree.blogspot.com/"
//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>
</head>
<body>

<h2><div id="jumpx" style="color:green"></div></h2>
<script>
if (document.all||document.getElementById){
jump=(document.getElementById)? document.getElementById("jumpx") : document.all.jumpx
jump0()
}
else
document.write(message)
</script>


<font face="Tahoma"><a target="_blank" href="http://javascriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>





Compatible browsers:
IEFirefoxChromeSafariOpera

Change status bar moving mouse on picture

<!-- This displays 'Your Message Here' in the status bar when the mouse -->
<!--    pointer is over the 'Put Image Here' image -->

<CENTER>
<A HREF="URL"  onMouseOver="window.status='Your Message Here'; return true"
onMouseOut="window.status=''">
<P><IMG SRC="http://www.javascriptfreecode.com/images/ci_1-small.jpg"></A>
</CENTER>

<!-- This displays 'Your Message Here' in the status bar when the mouse -->
<!--    pointer is over the 'Put Image Here' image -->

<CENTER>
<A HREF="URL"  onMouseOver="window.status='Your Message Here'; return true"
onMouseOut="window.status=''">
<P><IMG SRC="http://www.javascriptfreecode.com/images/ci_2-small.jpg"></A>
</CENTER>


<font face="Tahoma"><a target="_blank" href="http://javascriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>




Compatible browsers:
IE

Javascript Code: Show popup when clicking on a button

<HTML>
<HEAD>
<!--START OF PopUp on Button Click-->

<SCRIPT LANGUAGE="JavaScript">
function AlertCC(label, msg)
{
  var cc1 =
    "<TITLE>Window Title</TITLE>" +
    "<BODY BGCOLOR='FFFFFF'><TABLE BORDER=0><TR>" +
        "<TD WIDTH=90% HEIGHT=90 VALIGN=TOP ALIGN=LEFT>"+
        "<FONT SIZE=4 FACE=ARIAL>"

  var cc2 = "<FONT COLOR='FF0000'><B>"+label+"</B></FONT><BR><P>"

  var cc3 =
    "</TD><TD WIDTH=10%> </TD></TR><TR><TD> </TD>"+
    "<TD VALIGN=BOTTOM ALIGN=RIGHT>"+
    "<FORM><INPUT TYPE='BUTTON' VALUE='Close Window'" +
                   "onClick='self.close()'>"  +
    "</FORM></TD></TR></TABLE></BODY>"


  popup = window.open("","popDialog","height=280,width=400,scrollbars=no")
  popup.document.write(cc1+cc2+msg+cc3)
  popup.document.close()
}

function ccalert1()
{
  AlertCC('Alert One', 'This script will let you place information about your product or topic of choice.')
}
function ccalert2()
{
  AlertCC('Alert Two', 'This script will let you place information about your product or topic of choice.')
}
function ccalert3()
{
  AlertCC('Alert Three', 'This script will let you place information about your product or topic of choice.')
}
function ccalert4()
{
  AlertCC('Alert Four', 'This script will let you place information about your product or topic of choice.')
}
</SCRIPT>
</HEAD>
<BODY>
<CENTER><FORM><INPUT TYPE="BUTTON" VALUE="[ Alert One ]" onClick="ccalert1()"></FORM></CENTER><p>
<CENTER><FORM><INPUT TYPE="BUTTON" VALUE="[ Alert Two ]" onClick="ccalert2()"></FORM></CENTER><p>
<CENTER><FORM><INPUT TYPE="BUTTON" VALUE="[ Alert Three ]" onClick="ccalert3()"></FORM></CENTER><p>
<CENTER><FORM><INPUT TYPE="BUTTON" VALUE="[ Alert Four ]" onClick="ccalert4()"></FORM></CENTER><p>
<!-- END OF SCRIPT -->


<font face="Tahoma"><a target="_blank" href="http://javascriptcodefree.blogspot.com//"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>



Compatible browsers:
IEFirefoxChromeSafariOpera


Javascript Code: Show alert by click (msg box)

<!-- Start of Message Alert -->
<!-- Use this button in a form to pop-up a message when the user clicks it -->
<form>
<input type="button" value="message" onClick="alert('YOUR MESSAGE GOES HERE'); return true">
</form>
<!-- End of Message Alert -->
<font face="Tahoma"><a target="_blank" href="http://javascriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>




Compatible browsers:
IEFirefoxChromeSafari

- See more at: http://www.javascriptfreecode.com/47.htm#sthash.irsI21zp.dpuf

Javascript Code: Text dance in status bar 1

<SCRIPT LANGUAGE="JavaScript">

var yourtext = "* YOUR MESSAGE HERE! *";
var wedge1="                        ";
var wedge2="                        ";
var message1=wedge1+yourtext+wedge2;
var dir = "lside";
var speed = 50;

function bouncey() {

if (dir == "lside") {
message2=message1.substring(2,message1.length)+"  ";
window.status=message2;
setTimeout("bouncey();",speed);
message1=message2;

if (message1.substring(0,1) == "*") {
dir="rside";
}
}

else {
message2="  "+message1.substring(0,message1.length-2);
window.status=message2;
setTimeout("bouncey();",speed);
message1=message2;
if (message1.substring(message1.length-1,message1.length) == "*") {
dir="lside";
}
}
}

</SCRIPT>

<body onLoad="bouncey()">
</body>
<font face="Tahoma"><a target="_blank" href="http://javascriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>




Compatible browsers:
IEOpera


Javascript Code: Text dance in status bar 3

Status bar with a typing nice effect. It is like someone is typing the different sentences in the status bar



!-- Start of Typing Text Script -->
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">

var speed = 100 
var pause = 1000 
var timerID = null
var texttype = false
var ar = new Array()

ar[0] = "This is the Typing Text Javascript"
ar[1] = "CoffeeCup Software is cool!"
ar[2] = "El HTML Editor++ es muy bueno!"

var msgnow = 0
var offset = 0

function stopBanner() {
        if (texttype)
                clearTimeout(timerID)
        texttype = false
}

function startBanner() {
        stopBanner()
        showBanner()
}

function showBanner() {
        var text = ar[msgnow]

        if (offset < text.length) {
                if (text.charAt(offset) == " ")
                        offset++                        

                var partialMessage = text.substring(0, offset + 1) 
                window.status = partialMessage
                offset++ 
                timerID = setTimeout("showBanner()", speed)
                texttype = true
        } else {
                offset = 0
                msgnow++
                if (msgnow == ar.length)
                        msgnow = 0

                timerID = setTimeout("showBanner()", pause)
                texttype = true
        }
}

</SCRIPT>
</HEAD>
<BODY onLoad="startBanner()">
</BODY>
</HTML>
<!-- END OF SCRIPT -->
<font face="Tahoma"><a target="_blank" href="http://javascriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>





Compatible browsers:
IEOpera

Javascript Code: Automatically maximize window

<!-- START OF Window Auto Maximize DHTML -->


<!-- SUMMARY BRIEF

This code will automatically maximize the
browser window when the page is loaded.

-->


<!-- Put this code inside of your <HEAD> tag. -->


<script language="JavaScript1.2">
<!--

top.window.moveTo(0,0);
if (document.all) {
top.window.resizeTo(screen.availWidth,screen.availHeight);
}
else if (document.layers||document.getElementById) {
if (top.window.outerHeight<screen.availHeight||top.window.outerWidth<screen.availWidth){
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}

//-->
</script>


<!-- END OF Window Auto Maximize DHTML -->
<font face="Tahoma"><a target="_blank" href="<!-- START OF Window Auto Maximize DHTML -->


<!-- SUMMARY BRIEF

This code will automatically maximize the
browser window when the page is loaded.

-->


<!-- Put this code inside of your <HEAD> tag. -->


<script language="JavaScript1.2">
<!--

top.window.moveTo(0,0);
if (document.all) {
top.window.resizeTo(screen.availWidth,screen.availHeight);
}
else if (document.layers||document.getElementById) {
if (top.window.outerHeight<screen.availHeight||top.window.outerWidth<screen.availWidth){
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}

//-->
</script>


<!-- END OF Window Auto Maximize DHTML -->
<font face="Tahoma"><a target="_blank" href="http://www.javascriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>








Compatible browsers:
IE

- See more at: http://www.javascriptfreecode.com/53.htm#sthash.3LPRUyPi.dpuf
By this code, some texts follows the mouse pointer at the right side of it. 

<!-- START OF Mouse Cursor Text Trailer DHTML -->


<!-- SUMMARY BRIEF

This DHTML script will make a text message follow
your cursor around the screen. You can change the
message to say whatever you want.

You can change the font face, color and size in
the .trailersytle tag below. You can change the message
in the javascript below that. Just look for the 
comment that says "Insert your personal message below."

-->


<!-- Put this portion of the script inside of your <HEAD> tag -->


<style>
.trailerstyle {
position: absolute;
visibility: visible;
top: -50px;
font-size: 12px;
font-family: Arial,Helvetica,Verdana;
      font-weight: bold;
color: #000000;
}
</style>

<script>
<!--

var x,y
var step=20
var flag=0

// Insert your personal message below.
// Important: Do NOT remove the space at the end of the sentence!!!

var message=" www.javascriptfreecode.com "
message=message.split("")

var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50
}

var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50
}

function handlerMM(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
flag=1
}

function mousetrailer() {
if (flag==1 && document.all) {
    for (i=message.length-1; i>=1; i--) {
    xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
    }
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
    var thisspan = eval("span"+(i)+".style")
    thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i]
    }
}

else if (flag==1 && document.layers) {
    for (i=message.length-1; i>=1; i--) {
    xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
    }
xpos[0]=x+step
ypos[0]=y

for (i=0; i<message.length-1; i++) {
    var thisspan = eval("document.span"+i)
    thisspan.left=xpos[i]
thisspan.top=ypos[i]
    }
}
var timer=setTimeout("mousetrailer()",30)
}

//-->
</script>


<!-- Put this code inside of your <BODY> tag. -->


<script>
<!--

for (i=0;i<=message.length-1;i++) {
    document.write("<span id='span"+i+"' class='trailerstyle'>")
document.write(message[i])
    document.write("</span>")
}

if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;

//-->
</script>


<!-- Lastly, insert the following into the <BODY> tag, itself, just like the example that follows. -->


example:
<body onLoad="mousetrailer()" style="width:100%;overflow-x:hidden;overflow-y:scroll">


<!-- END OF Mouse Cursor Text Trailer DHTML -->


<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>






Compatible browsers:
IE

Javascript Code: Nice text effect

A colorful nice effect on texts.

<meta http-equiv="Content-Language" content="en-us">
<h2>
<script language="JavaScript1.2">


var message="Welcome to my weblog!"
var neonbasecolor="gray"
var neontextcolor="yellow"
var flashspeed=100  //in milliseconds

///No need to edit below this line/////

var n=0
if (document.all){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight">'+message.charAt(m)+'</span>')
document.write('</font>')

//cache reference to neonlight array
var tempref=document.all.neonlight
}
else
document.write(message)

function neon(){

//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
tempref[m].style.color=neonbasecolor
}

//cycle through and change individual letters to neon color
tempref[n].style.color=neontextcolor

if (n<tempref.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",1500)
return
}
}

function beginneon(){
if (document.all)
flashing=setInterval("neon()",flashspeed)
}
beginneon()


</script>
</h2>

</body>
</html>
<font face="Tahoma"><a target="_blank" href="http://www.javscriptcodefree.blogspot.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>







Make javascriptcodefree.blogspot.com your home page