<script type="text/javascript">


var imageclock=new Object()
	//Enter path to clock digit images here, in order of 0-9, then "am/pm", then colon image:
	imageclock.digits=["c0.gif", "c1.gif", "c2.gif", "c3.gif", "c4.gif", "c5.gif", "c6.gif", "c7.gif", "c8.gif", "c9.gif", "cam.gif", "cpm.gif", "colon.gif"]
	imageclock.instances=0
	var preloadimages=[]
	for (var i=0; i<imageclock.digits.length; i++){ //preload images
		preloadimages[i]=new Image()
		preloadimages[i].src=imageclock.digits[i]
	}

	imageclock.imageHTML=function(timestring){ //return timestring (ie: 1:56:38) into string of images instead
		var sections=timestring.split(":")
		if (sections[0]=="0") //If hour field is 0 (aka 12 AM)
			sections[0]="12"
		else if (sections[0]>=13)
			sections[0]=sections[0]-12+""
		for (var i=0; i<sections.length; i++){
			if (sections[i].length==1)
				sections[i]='<img src="'+imageclock.digits[0]+'" />'+'<img src="'+imageclock.digits[parseInt(sections[i])]+'" />'
			else
				sections[i]='<img src="'+imageclock.digits[parseInt(sections[i].charAt(0))]+'" />'+'<img src="'+imageclock.digits[parseInt(sections[i].charAt(1))]+'" />'
		}
		return sections[0]+'<img src="'+imageclock.digits[12]+'" />'+sections[1]+'<img src="'+imageclock.digits[12]+'" />'+sections[2]
	}

	imageclock.display=function(){
		var clockinstance=this
		this.spanid="clockspan"+(imageclock.instances++)
		dcidcidocument.write('<span id="'+this.spanid+'"></span>')
		this.update()
		setInterval(function(){clockinstance.update()}, 1000)
	}

	imageclock.display.prototype.update=function(){
		var dateobj=new Date()
		var currenttime=dateobj.getHours()+":"+dateobj.getMinutes()+":"+dateobj.getSeconds() //create time string
		var currenttimeHTML=imageclock.imageHTML(currenttime)+'<img src="'+((dateobj.getHours()>=12)? imageclock.digits[11] : imageclock.digits[10])+'" />'
		dcidcidocument.getElementById(this.spanid).innerHTML=currenttimeHTML

	}


</script>

<script type="text/javascript">

new imageclock.display()

</script>

<style type="text/css">


.bevelmenu{
font: bold 13px arial;
padding: 6px 0;
margin: 0;
width: 100%;
background-color: #FFF2BF;
text-align: center; /*يمكنك التحكم فى اتجاه القائمة سواء يمين او وسط او يسار من هنا*/
}

.bevelmenu li{
list-style: none;
display: inline;
}

.bevelmenu li a{
padding: 3px 0.5em;
text-decoration: none;
color: black;
background-color: #FFF2BF;
border: 2px solid #FFF2BF;
}

.bevelmenu li a:hover{
color: black;
background-color: #FFE271;
border-style: outset;
}

html>body .bevelmenu li a:active{ /* Apply mousedown effect only to NON IE browsers */
border-style: inset;
}
</style>

<ul class="bevelmenu">
<li><a href="http://www.arabwebtalk.com/index.php">الويب العربى</a></li>
<li><a href="http://www.arabwebtalk.com/index.php">الصفحة الرئيسية </a></li>
<li><a href="http://www.arabwebtalk.com/forumdisplay.php?f=88"> الحراج الالكترونى</a></li>
<li><a href="http://www.arabwebtalk.com/forumdisplay.php?f=12"> مزاد المواقع</a></li>
<li><a href="http://www.arabwebtalk.com/forumdisplay.php?f=15">التجارة الإلكترونية</a></li>
</ul>

<script language="JavaScript1.2">
//استبدل السطرين التاليين بمعلومات موقعك
var bookmarkurl="http://www.arabwebtalk.com"
var bookmarktitle="الويب العربى"

function addbookmark(){
if (dcidocument.all)
window.external.AddFavorite(bookmarkurl,bookmarktitle)
}

</script>

 <a href="javascript:addbookmark()">أضف الموقع للمفضلة</a>

<style type="text/css">


 /* remove the margin and bullets, set the padding for this demo only*/
.neon {margin:0 0 50px 0; padding:25px 0 100px 15px; list-style:none; background:#000; width:720px;}

 /* display the list items inline with a right margin to space the buttons. Use this to pre-load the hover image */
.neon li {display:inline; float:left; background:url(http://www.cssplay.co.uk/menus/neon_on.gif);}

/* style the links and place the background image to start from left edge */
.neon li a {display:block; height:32px; float:left; background:url(http://www.cssplay.co.uk/menus/neon_off.gif); text-decoration:none; font-size:10px; font-family:arial, sans-serif; letter-spacing:1px; line-height:36px;}

/* style the b element to posiition it to the right by 20 pixels and even out the text with 20 pixel right padding */
.neon li a b {margin:0 0 0 40px; display:inline; float:left; height:32px; background:url(neon_off.gif) right top; padding:0 40px 0 0; color:#fff;}

/* style the link hover and the link hover b to replace the background image - border:0 needed for IE6 to work */
.neon li a:hover, .neon li a:hover b {border:0; background-image:url(neon_on.gif); cursor:pointer; color:#000;}

.neon li a.current, .neon li a.current b, .neon li a.current:hover , .neon li a.current:hover b {background-image:url(neon_on.gif); color:#000; cursor:default;}

</style>

<h3>قائمة نيون مضيئة</h3>

  <ul class="neon">
    <li><a href="#nogo"><b>الرئيسية</b></a></li>
    <li><a href="#nogo"><b>حول الموقع</b></a></li>
    <li><a href="#nogo"><b>سجل الزوار</b></a></li>
    <li><a href="#nogo" class="current"><b>اتصل بنا</b></a></li>
    <li><a href="#nogo"><b>مواقع هامة</b></a></li>
  </ul>

<BODY onLoad="alert('مرحبـــاً');"onUnload="alert('مع السلامة ')">