تحميل القانون رقم 103.13 المتعلق بمحاربة العنف ضد النساء pdf or word

                           بسم الله الرحمن الرحيم

والصلاة والسلام على خير خلق الله سيدنا محمد عليه أفضل الصلاة وأتم التسليم

قائمة منسدلة تقنية احترافية باستخدام CSS3 والجيكوري

قائمة احترافيه منسدلة بأفضل التقنيات والتي لا تخلو مدونة الا وتحتاجها , القائمة تعتبر من أركان الموقع المهمه والتي يستدل بها الزائر بأقسام المواقع وروابطه المهمة .
الحمدلله انتهيت من تعديل القائمة وجعلت منظرها عصري وجذاب وذلك بتنسيق الالوان والاحجام , ايضاَ تم اضافة الخط الكوفي الجميل الى القائمة وروابطها .

أولا: معاينة مباشرة للقائمة 

القائمة متوفره باربع الوان اختر مايناسبك منها ثم اتبع الاتي :

طريقة التركيب :

• اذهب الى التخطيط .
• ثم اضافة اداة جديدة > يجب ان تكون تحت الهيدر مباشرة .
• ثم الصق كود الأداة التي تريدها , طبعاَ مع تعديل الروابط والأسماء بما تريد :

الشكل الأول " الرمادي  :

صورة :

الكود:

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!-- menu by:7lolblogger.com -->
<div id="menu">
<ul>
  <li class='gghfg'><a href='#'><img src='https://lh4.googleusercontent.com/-2p92HsBcl3Q/UwUWKvmwkYI/AAAAAAAAGBY/qU9MdFbVDrc/home.png'/></a></li>
   <li><a href="#">وصلة</a></li>
   <li><a href="#">وصلة</a></li>
<li><a href="#">وصلة رئيسية</a> <!-- الوصلة الأولى في القائمة -->
  <ul>  <!-- القائمة الفرعية -->
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<!-- menu by:7lolblogger.com -->
</ul>
</div>

<script>
  window.onload = function(){
    $("#menu > ul > li").hover(
      function(){ $(this).find("ul").slideDown('fast'); } ,
      function(){ $(this).find("ul").slideUp('fast'); } );
}
</script>
<style>
@font-face {
font-family: 'DroidKufi-Regular';
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot');
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot?') format('embedded-opentype'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.woff') format('woff'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.ttf') format('truetype');}

#menu {
width: 100%;
max-width: 1000px;
margin: 0 auto;
background: #222;
display: inline-block;
border-bottom: 5px solid #4D4D4D;
height: 45px;
}
#menu  ul {
  padding:0;
  margin:0;
  list-style:none;
  position:relative; //مهمة
}
#menu > ul > li {
  float:right;
  padding:0;
  margin:0 0 -7px 0;
}
#menu > ul > li > a {
display: block;
min-width: 50px;
text-align: center;
padding: 10px 15px 10px 15px;
text-decoration: none;
color: #FFF;
font: 13px 'DroidKufi-Regular';
}
#menu > ul > li > a:hover {
background: #5C5B5B;
border-bottom: #5C5B5B;
}
#menu > ul > li > ul {
  position:absolute;
  top:49px;
  display:none;
  margin-left: -60px;
}
#menu > ul > li > ul > li > a {
background: #5C5B5B;
display: block;
padding: 5px 10px 5px 10px;
text-decoration: none;
color: #FFF;
border-bottom: 1px solid #575757;
min-width: 130px;
text-align: right;
font: 12px 'DroidKufi-Regular';
}
#menu > ul > li > ul > li > a:hover {
background: #222;
border-bottom: 1px solid #202020;
}
.gghfg a {
width: 48px !important;
min-width: 48px !important;
height: 25px;
background: #5C5B5B !important;
padding: 10px;
}
</style>

الشكل الثاني " أحمر " : 

صورة :

الكود :

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!-- menu by:7lolblogger.com -->
<div id="menu">
<ul>
  <li class='gghfg'><a href='#'><img src='https://lh4.googleusercontent.com/-2p92HsBcl3Q/UwUWKvmwkYI/AAAAAAAAGBY/qU9MdFbVDrc/home.png'/></a></li>
   <li><a href="#">وصلة</a></li>
   <li><a href="#">وصلة</a></li>
<li><a href="#">وصلة رئيسية</a> <!-- الوصلة الأولى في القائمة -->
  <ul>  <!-- القائمة الفرعية -->
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<!-- menu by:7lolblogger.com -->
</ul>
</div>

<script>
  window.onload = function(){
    $("#menu > ul > li").hover(
      function(){ $(this).find("ul").slideDown('fast'); } ,
      function(){ $(this).find("ul").slideUp('fast'); } );
}
</script>
<style>
@font-face {
font-family: 'DroidKufi-Regular';
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot');
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot?') format('embedded-opentype'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.woff') format('woff'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.ttf') format('truetype');}

#menu {
width: 100%;
max-width: 1000px;
margin: 0 auto;
background: #222;
display: inline-block;
border-bottom: 5px solid #DD395A;
height: 45px;
}
#menu  ul {
  padding:0;
  margin:0;
  list-style:none;
  position:relative; //مهمة
}
#menu > ul > li {
  float:right;
  padding:0;
  margin:0 0 -7px 0;
}
#menu > ul > li > a {
display: block;
min-width: 50px;
text-align: center;
padding: 10px 15px 10px 15px;
text-decoration: none;
color: #FFF;
font: 13px 'DroidKufi-Regular';
}
#menu > ul > li > a:hover {
background: #CC173B;
border-bottom: 4px solid #DD395A;
}
#menu > ul > li > ul {
  position:absolute;
  top:49px;
  display:none;
  margin-left: -60px;
}
#menu > ul > li > ul > li > a {
background: #CC173B;
display: block;
padding: 5px 10px 5px 10px;
text-decoration: none;
color: #FFF;
border-bottom: 1px solid #DD395A;
min-width: 130px;
text-align: right;
font: 12px 'DroidKufi-Regular';
}
#menu > ul > li > ul > li > a:hover {
background: #222;
border-bottom: 1px solid #202020;
}
.gghfg a {
width: 48px !important;
min-width: 48px !important;
height: 25px;
background: #CC173B !important;
padding: 10px;
}
</style>

الشكل الثالث " ازرق " : 

صورة :

الكود :

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!-- menu by:7lolblogger.com -->
<div id="menu">
<ul>
  <li class='gghfg'><a href='#'><img src='https://lh4.googleusercontent.com/-2p92HsBcl3Q/UwUWKvmwkYI/AAAAAAAAGBY/qU9MdFbVDrc/home.png'/></a></li>
   <li><a href="#">وصلة</a></li>
   <li><a href="#">وصلة</a></li>
<li><a href="#">وصلة رئيسية</a> <!-- الوصلة الأولى في القائمة -->
  <ul>  <!-- القائمة الفرعية -->
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<!-- menu by:7lolblogger.com -->
</ul>
</div>

<script>
  window.onload = function(){
    $("#menu > ul > li").hover(
      function(){ $(this).find("ul").slideDown('fast'); } ,
      function(){ $(this).find("ul").slideUp('fast'); } );
}
</script>
<style>
@font-face {
font-family: 'DroidKufi-Regular';
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot');
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot?') format('embedded-opentype'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.woff') format('woff'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.ttf') format('truetype');}

#menu {
width: 100%;
max-width: 1000px;
margin: 0 auto;
background: #222;
display: inline-block;
border-bottom: 5px solid #4BCDF7;
height: 45px;
}
#menu  ul {
  padding:0;
  margin:0;
  list-style:none;
  position:relative; //مهمة
}
#menu > ul > li {
  float:right;
  padding:0;
  margin:0 0 -7px 0;
}
#menu > ul > li > a {
display: block;
min-width: 50px;
text-align: center;
padding: 10px 15px 10px 15px;
text-decoration: none;
color: #FFF;
font: 13px 'DroidKufi-Regular';
}
#menu > ul > li > a:hover {
background: #39B8E9;
border-bottom: 4px solid #4BCDF7;
}
#menu > ul > li > ul {
  position:absolute;
  top:49px;
  display:none;
  margin-left: -60px;
}
#menu > ul > li > ul > li > a {
background: #39B8E9;
display: block;
padding: 5px 10px 5px 10px;
text-decoration: none;
color: #FFF;
border-bottom: 1px solid #4BCDF7;
min-width: 130px;
text-align: right;
font: 12px 'DroidKufi-Regular';
}
#menu > ul > li > ul > li > a:hover {
background: #222;
border-bottom: 1px solid #202020;
}
.gghfg a {
width: 48px !important;
min-width: 48px !important;
height: 25px;
background: #39B8E9 !important;
padding: 10px;
}
</style>

الشكل الرابع " أخضر " : 

صورة :

الكود :

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<!-- menu by:7lolblogger.com -->
<div id="menu">
<ul>
  <li class='gghfg'><a href='#'><img src='https://lh4.googleusercontent.com/-2p92HsBcl3Q/UwUWKvmwkYI/AAAAAAAAGBY/qU9MdFbVDrc/home.png'/></a></li>
   <li><a href="#">وصلة</a></li>
   <li><a href="#">وصلة</a></li>
<li><a href="#">وصلة رئيسية</a> <!-- الوصلة الأولى في القائمة -->
  <ul>  <!-- القائمة الفرعية -->
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<li><a href="#">وصلة رئيسية</a>
  <ul>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  <li><a href="#">وصلة فرعية</a></li>
  </ul>
</li>
<!-- menu by:7lolblogger.com -->
</ul>
</div>

<script>
  window.onload = function(){
    $("#menu > ul > li").hover(
      function(){ $(this).find("ul").slideDown('fast'); } ,
      function(){ $(this).find("ul").slideUp('fast'); } );
}
</script>
<style>
@font-face {
font-family: 'DroidKufi-Regular';
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot');
src: url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.eot?') format('embedded-opentype'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.woff') format('woff'),
url('http://dl.dropbox.com/u/22531314/webfont/fonts/DroidKufi-Regular.ttf') format('truetype');}

#menu {
width: 100%;
max-width: 1000px;
margin: 0 auto;
background: #222;
display: inline-block;
border-bottom: 5px solid #42E27C;
height: 45px;
}
#menu  ul {
  padding:0;
  margin:0;
  list-style:none;
  position:relative; //مهمة
}
#menu > ul > li {
  float:right;
  padding:0;
  margin:0 0 -7px 0;
}
#menu > ul > li > a {
display: block;
min-width: 50px;
text-align: center;
padding: 10px 15px 10px 15px;
text-decoration: none;
color: #FFF;
font: 13px 'DroidKufi-Regular';
}
#menu > ul > li > a:hover {
background: #2ABD5F;
border-bottom: 4px solid #42E27C;
}
#menu > ul > li > ul {
  position:absolute;
  top:49px;
  display:none;
  margin-left: -60px;
}
#menu > ul > li > ul > li > a {
background: #2ABD5F;
display: block;
padding: 5px 10px 5px 10px;
text-decoration: none;
color: #FFF;
border-bottom: 1px solid #42E27C;
min-width: 130px;
text-align: right;
font: 12px 'DroidKufi-Regular';
}
#menu > ul > li > ul > li > a:hover {
background: #222;
border-bottom: 1px solid #202020;
}
.gghfg a {
width: 48px !important;
min-width: 48px !important;
height: 25px;
background: #2ABD5F !important;
padding: 10px;
}
</style>