طريقة عمل قائمة منسدلة للروابط والفيديو داخل المدونة او داخل المواضيع

 طريقة عمل قائمة منسدلة للروابط والفيديو داخل المدونة او داخل المواضيع 

اذا اردت استخدامها داخل موضوع عدل الادخال فى محرر الموضوعات الى وضع html وضع الكود بداخلة 
اما اذا اردت ذلك فى المدونة او مكان ما فاستخدم اداة java script
سوف نقدم لكم فى هذه التدوينة الكود الذى من خلالة يمكنك عمل قائمة منسدلة للروابط او للفيديو واليكم الكود المستخدم فى هذه العملية :هذا الكود المستخدم لعمل قائمة روابط:



<center><div style="width:auto; padding:0 10px 0 0;margin:5px 0 5px 0;background:#CB3A00;box-shadow: 0 1px 2px #999;-moz-box-shadow: 0 1px 2px #999;-webkit-box-shadow: 0 1px 2px #999;border:2px solid #777;border-radius:15px;-webkit-border-radius:15px;-moz-border-radius:15px;">
<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="font-size:17px; width:100%;border:0; background:transparent; color:#fff;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;">
<option>عنوان القائمة</option>
<option value="#">Name</option>
<option value="#">Name</option>
<option value="#">Name</option>
<option value="#">Name</option>
<option value="#">Name</option>
</select></form></div></center>


 اما الكود الذى سوف نضع به قائمة منسدلة للفيديو فهو كالتالى:


<center><script type="text/javascript">
function MostrarVideo(idYouTube)
{
var contenedor = document.getElementById('divInnerVideo');
if(idYouTube == "")
{
contenedor.innerHTML = "";
}
else
{
var dimensiones = "width='300' height='230' frameborder='0'";
var url = "http://www.youtube.com/embed/" + idYouTube;
contenedor.innerHTML = "<iframe " + dimensiones + " src='"+ url +"'></iframe>";
}
}
</script>
<div style="width:auto; padding:7px 10px 8px 10px;margin:5px 0 5px 0;background: #969595;background: -moz-linear-gradient(top,#969595,#000);background: -webkit-linear-gradient(top,#969595,#000);border-radius:8px;-webkit-border-radius:8px;-moz-border-radius:8px;box-shadow: 0 1px 2px #999;-moz-box-shadow: 0 1px 2px #999;-webkit-box-shadow: 0 1px 2px #999;border-top:4px dashed #fff; border-bottom:4px dashed #fff; border-right:4px solid #fff; border-left:4px solid #fff;">
<select id="sVideos" onchange="MostrarVideo(this.value);" style="font-size:17px; width:100%;">
<option value="selected="selected">عنوان القائمة</option>
<option value="VID">Name</option>

اذا اردت وضع فيديو اخر فكل ما عليك هو تكرار السطر الأخضر

وبدل الكلمة VID  بمعرف الفديو 

ومعرف الفيديو هو مجموعة الارقام والحروف التى تكون فى نهاية عنوان الفيديو فى المتصفح ارجو ان اكون قد وفقت فى الشرح.

لا تنسى المشاركة