I am looking for a code which does a simple task. below is the task

let's say my site is <http://www.url.com>

I want when my user go to this site they see a box on top of the page which shows my site name and also my contact details and also a countdown timer.

below this line I want to show the exact same website of few different URL and I want to set a timer as well so that these few websites rotate and that timer on top shows how long it is until the next refresh and next website. I want only this part of the webpage to refresh and I want the top line to be still.

<http://i58.tinypic.com/s6t84h.jpg>

you can see what I want in the image above.

I was told that it can be done using iframe but I don't know how to do it and I also don't want scroll

I appreciate if you could help me

I found this solution and it seems to be working. I just need the countdown timer and also I want to crop out let's say 200px of top of each website and like shift it up because one page doesn't show all the content I want unless using scrolling and I don't want that.

```
    <!DOCTYPE html>
    <html>
    <body>

    <div align="center" style="border:4px solid red ">
    <div style="color:#0000FF">
    <h3>some content<color:#0000FF/h3>
<h3>some more content<color:#0000FF/h3>
</div> 
</div>

<iframe id="rotator" src="http://www.zcast.ir" width="100%" height="600" scrolling="no" border="0" ></iframe>

<script>
// start when the page is loaded
window.onload = function() {

var urls = [
"http://www.zcast.ir",
"http://www.tgju.org",
"http://www.on3.ir", 
"http://www.goldinfo.ir",
"http://www.zarban.ir",
];

  var index = 1;
  var el = document.getElementById("rotator");

  setTimeout(function rotate() {

    if ( index === urls.length ) {
  index = 0;
}

el.src = urls[index];
index  = index + 1;

// continue rotating iframes
setTimeout(rotate, 5000);

}, 5000); // 5000ms = 5s
 };
</script>

</body>
</html> 

```