كود الاختيار المتعدد بشكل جميل لصفحات ال HTML

كود رائع و منسق اقتبسته من اسلوب الاى باد يمكن ان يستخدم فى بوابات المواقع و المنتديات

الكود :

الكود:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>Happy 3ID</title>
<script type="text/javascript"

src="http://yourjavascript.com/1346118141/jquery.js"></script>
<script type="text/javascript"

src="http://yourjavascript.com/4110831136/interface.js"></script>

<style media="screen" type="text/css">

body {
font: 11px Tahoma, Helvetica, sans-serif;
padding: 0;
margin: 0;
}
img {
border: none;
}

/* dock - top */
.dock {
position: relative;
height: 50px;
text-align: center;
}
.dock-container {
position: absolute;
height: 50px;
padding-left: 20px;
}
a.dock-item {
display: block;
width: 40px;
color: #000;
position: absolute;
top: 0px;
text-align: center;
text-decoration: none;
font: bold 12px Tahoma,Helvetica, sans-serif;
}
.dock-item img {
border: none;
margin: 5px 10px 0px;
width: 100%;
}
.dock-item span {
display: none;
padding-left: 20px;
}

</style>

</head>
<body>


<div class="dock" id="dock">
  <div class="dock-container">
<a class="dock-item" href="http://help.ahlamontada.com/"><img

src="http://i41.servimg.com/u/f41/14/51/27/24/am-ico11.png" alt="home"

/><span>Home </span></a>
<a class="dock-item" href="http://help.ahlamontada.com/montada-

f1/"><img src="http://2img.net/i/fa/fdf/annonce.png" alt="News" /><span>Notices

and News</span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f5-

montada"><img src="http://2img.net/i/fa/fdf/questions.png" alt="FAQ"

/><span>FAQ</span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f79-

montada"><img src="http://2img.net/i/fa/fdf/magic.png" alt="Advanced

techniques" /><span>Advanced techniques</span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f84-

montada"><img src="http://2img.net/i/fa/fdf/peindre.png" alt="Design"

/><span>Design services and innovation</span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f22-

montada"><img src="http://2img.net/i/fa/fdf_ar3/multib.png" alt="Support"

/><span>Support Section AhlaBlogs</span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f7-

montada"><img src="http://2img.net/i/fa/optimisation_fdf/common/medaille.gif"

alt="calendar" /><span>General Thought Forum </span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f15-

montada"><img src="http://2img.net/i/fa/fdf_ar3/discussion_ar.png"

alt="Discussion" /><span>Discussion Section</span></a>
<a class="dock-item" href="http://help.ahlamontada.com/f38-

montada"><img src="http://2img.net/i/fa/fdf/ampoule.png" alt="Suggestions"

/><span>Suggestions Forum </span></a>
  </div>
</div>


<script type="text/javascript">

$(document).ready(
   function()
   {
      $('#dock').Fisheye(
         {
            maxWidth: 50,
            items: 'a',
            itemsText: 'span',
            container: '.dock-container',
            itemWidth: 40,
            proximity: 90,
            halign : 'center',
            valign : 'center'
         }
      )
   $('#dock2').Fisheye(
         {
            maxWidth: 60,
            items: 'a',
            itemsText: 'span',
            container: '.dock-container2',
            itemWidth: 40,
            proximity: 80,
            alignment : 'left',
            valign: 'bottom',
            halign : 'center'
         }
      )
   }
);

</script>
</body>
</html>

صوره للكود:
كود الاختيار المتعدد بشكل جميل لصفحات ال HTML Captur17

شكرا لهذه المسابقات Cool

» الاختيار المتعدد :: في البيانات الشخصيه
» طلب كود الاختيار المتعدد من الصور ( كود سهل ولكن نادر)
» كود html لفتح نافذة فيها الموضوع فقط لصفحات HTML
» طلب كود وضع اسم لصفحات HTML
» عمل صلاحيات لصفحات html

صفحة 1 من اصل 1