Tuesday, February 22, 2011

Iframe busy inidcating spinning bar.

Be The First To Comment
I got one solution on delving the internet

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Iframe Loading Notice - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#holder, #holder iframe {
position:relative;
width:500px;
height:400px
}
#loading {
height:50px;
width:125px;
padding:1ex;
position:absolute;
top:50%;
left:50%;
margin-top:-25px;
margin-left:-63px;
display:none;
border:2px groove gray;
background-color:#cccccc;
color:#333333;
}
</style>
<script type="text/javascript">
var loadit=function(){
var f=document.getElementById('myframe'), l=document.getElementById('loading').style;
l.display='block';
if(f.onload==null){
f.onload=function(){l.display='none'};
if(window.attachEvent)
f.attachEvent('onload', f.onload);
}
return true;
}

</script>
</head>
<body>
<div id="holder">
<iframe id="myframe" name="myframe" src="about:blank" scrolling="auto" frameborder="1"></iframe>
<div id="loading">Loading . . .</div>
</div>
<a href="http://www.google.com/" target="myframe" onclick="return loadit();">Google</a><br>
<a href="http://www.dynamicdrive.com/" target="myframe" onclick="return loadit();">Dynamic Drive</a>
</body>
</html>


Thank you for the original post(http://www.dynamicdrive.com/forums/showthread.php?t=22759).

And I modified this according to my need as below:

<style type="text/css">
#holder, #holder iframe {
position:relative;
width:500px;
height:400px
}
#loading {
<!--height:50px;
width:125px;
padding:1ex;
position:absolute;
top:50%;
left:50%;
margin-top:-25px;
margin-left:-63px; -->
display:none;
<!--border:2px groove gray;
background-color:#cccccc;
color:#333333; -->
}
</style>
<script type="text/javascript">
var loadit=function(){
var f=document.getElementById('iframemap'), l=document.getElementById('loading').style;
l.display='block';
if(f.onload==null){
f.onload=function(){l.display='none'};
if(window.attachEvent)
f.attachEvent('onload', f.onload);
}
return true;
}
</script>

And what you need is spinning.gif image.


<div id="holder">
          <iframe name="iframemap" id="iframemap" width="550" height="450"></iframe>
          <div id="loading"> <img src="images/busy.gif"></div>
          </div>


Cheers !!

Friday, February 18, 2011

Convert PHP array into Javascript array

1 Comment
I got a chance to write a script that converts php array into javascript  array.
Here it is..
<?php
  $phparray= array(1,2,3,4,5);
?>

<script type="text/javascript" language="javascript">
    var mydata = new Array (
    <?php
      for ($i = 0; ($i < count($phparray)); $i++) {
        if ($i > 0) {
          echo ",\n";
        }
        echo "    \"";
        echo $phparray[$i];
        echo "\"";
      }
     
    ?>
    );
</script>
 

© 2011 GIS and Remote Sensing Tools, Tips and more .. ToS | Privacy Policy | Sitemap

About Me