الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

كود اخفاء واظهار الفيديو

بدأه الازدي في 20 أبريل 2011 · 10 رد · 1,550 مشاهدة · في قسم البرمجة بــ Javascript
مشاركة: واتساب X فيسبوك تيليجرام
#1 صاحب الموضوع

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

السلام عليكم ورحمة الله وبركاته

نبارك لكم هذا المنتدى المبارك واعتذر عن بدأ مشاركاتي بسؤال, عموما لدي كود اخفاء واظهار المحتوى ويعمل بصفة ممتازة على الفاير فوكس لكن للاسف لا يعمل بصفة جيدة على الاكسبلورر و بعض المتصفحات الاخرى فمثلا لدي فيديو عند الضغط على الزر يظهر الفيديو و عند الضغط على الزر الاخر لعرض فيديو آخر يبقى الفيديو يعمل في الخلف في حال الاخفاء بينما في الفاير فوكس الفيديو يقفل حال اخفاء الفيديو وهذا الكود المستخدم


<Center>
<html>
<head>

<body>


<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){

$(".buttons").click(function () {
var divname= this.value;
$("#"+divname).show("slow").siblings().hide("slow");
});

});
</script>
</head>
<body>


<div id="buttonsDiv">

<input type="button" id="button1" class="buttons" value="Video"></input>
<input type="button" id="button#" class="buttons" value="اغلاق"></input>

</div>

<div>

<div id="Video" style="display:none">
<h2>YouTube</h2>
<iframe title="YouTube video player" width="480" height="390" src="http://www.youtube.com/embed/Qk1hS2MvJbQ" frameborder="0" allowfullscreen></iframe>

</div>


<div id="اغلاق" style="display:none">

</div>

</div>


</body>
</html>
</Center>
اعذروني يا جماعة فمعرفتي بالجافا كمعرفتي بالشعر الصيني  :blush: وانا اعلم انه من غير اللائق طلب توفير الكود من دون تعب لكن الجهل نقمة وكما ترون انا وجدت الكود بالصدفة لانه اعجبني طريقة عرضه المطلوب بارك الله فيكم كيف اجعل الكود يعمل بصفة جيدة كما في الفايرفوكس او هل هناك كود يعمل على اخفاء واظهار الفيديو وشغال على جميع المتصفحات او هل هناك قائمة تشغيل للفيديو في مربع عرض واحد اي playlist
تحياتي لكم  :)

      
تم تعديل هذه المشاركة بواسطة نجوم الكون في 20 أبريل 2011 في 20:33

      

      
    

  

    
    

      
#2
        
        

      
السلام عليكم ورحمه الله وبركاته
ممكن ترفق الكود علشان اعدله

      
      
1

      
.:: Wish to become better and better ::.

    

  

    
    

      
#3
        
        

      
جزاك الله خير على الرد الكود الذي في المربع هو الذي استخدمه فقط  :blink:
لو اختبرته في هذا الموقع سيعمل معك 
http://www.duketown.com/marcel/htmltest.shtml
قد قمت بازالة كود html فقط وارفقته شكرا لك مرة اخرى على الرد
Test.js

      
      

      
    

  

    
    

      
#4
        
        

      
السلام عليكم
جرب هذا الكود
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    	$(document).ready(function(){
    		$(".buttons").click(function () {
			var divname= this.value;
			if (divname == "Video") {
				// Add iframe to div#Video
				$("#Video").append('<h2>YouTube</h2><iframe title="YouTube video player" width="480" height="390" src="http://www.youtube.com/embed/Qk1hS2MvJbQ" frameborder="0" allowfullscreen></iframe>');
			} else if (divname == "Close") {
				// Clear the iframe
				$("#Video").empty();
			}

			//Hide/Show
			$("#"+divname).show("slow").siblings().hide("slow");
		});
	});
</script>
</head>
<body>
	<div id="buttonsDiv">
		<input type="button" id="button1" class="buttons" value="Video" />
		<input type="button" id="button#" class="buttons" value="Close" />
	</div>

	<div>
		<div id="Video" style="display:none"></div>
		<div id="Close" style="display:none"></div>
	</div>
</body>
</html>

      
      

      
    

  

    
    

      
#5
        
        

      
وعليكم السلام ورحمة الله 
اخي chocolatboy  اشكر لك اهتمامك الكود يعمل بشكل سليم اسأل الله لك التوفيق المعذرة اختبرت التطبيق بطريق خاطئة والان يعمل بشكل سليم شكرا لك الف شكر وجزاك الله خير انت و الاخ VB Helper سؤال اخير اذا اضفت اكثر من فيديو كيف يكون الكود وهناك مشكلة اخرى الفيديو يظهر مرة اخرى اي يفتح نافذة اخرى اذا تم النقر على نفس الزر
ما اريده بارك الله فيك عند اضافة اكثر من فيديو اذا عمل فيديو الفيديو الاخر  يتم اغلاقه + ان لا يتكرر الفيديو عند النقر عليه مرة اخرى 
آسف قد اثقلت عليكم لكن تحملوني بارك الله فيكم

      
تم تعديل هذه المشاركة بواسطة نجوم الكون في 22 أبريل 2011 في 00:54

      

      
    

  

    
    

      
#6
        
        

      
نجوم الكون كتب:
 سؤال اخير اذا اضفت اكثر من فيديو  هل اختاج الى تعديل
ممكن أن تضع كود لمحاولتك اضاقة أكثر من فيديو، التعديل سيكون ان  شاء الله سهل

      
      

      
    

  

    
    

      
#7
        
        

      
اشكرك اخي على الاهتمام 
ووفقك الله 
هذه محاولتي واعذرني على جهلي بلغة البرمجة (لا يعمل الفيديو الثاني الا عند النقر على الفيديو الاول ثم عند النقر على احد زري الفيديو وهو مفتوح يتكرر كذلك اضطر احيان الى تغير iframe الى embed او object لاختلاف الفيديو فليس من اليوتيوب فقط قد يكون من Justin.tv او اي موقع آخر 
lمثال على اقتباس من justin.tv 
<object type="application/x-shockwave-flash" height="300" width="400" id="live_embed_player_flash" data="http://www.justin.tv/widgets/live_embed_player.swf?channel=steven_bonnell_ii" bgcolor="#000000"><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="movie" value="http://www.justin.tv/widgets/live_embed_player.swf" /><param name="flashvars" value="channel=steven_bonnell_ii&auto_play=false&start_volume=25" /></object><a href="http://www.justin.tv/steven_bonnell_ii#r=-rid-&s=em" class="trk" style="padding:2px 0px 4px; display:block; width:345px; font-weight:normal; font-size:10px; text-decoration:underline; text-align:center;">Watch live video from Destiny - Starcraft 2 on Justin.tv</a>
<html>
<head>
<script src="jquery-latest.js"></script>
    <script>
    	$(document).ready(function(){
    		$(".buttons").click(function () {
			var divname= this.value;
			if (divname == "Video") {
				// Add embed to div#Video
				$("#Video").append('<h2>YouTube</h2><iframe title="YouTube video player" width="480" height="390" src="http://www.youtube.com/embed/Qk1hS2MvJbQ" frameborder="0" allowfullscreen></iframe>');
                $("#Video2").append('<h2>Youtube2</h2><iframe title="YouTube video player" width="640" height="390" src="http://www.youtube.com/embed/s0uoR4mJ6RE" frameborder="0" allowfullscreen></iframe>');

			} else if (divname == "Close") {
				// Clear the iframe
				$("#Video").empty();
			}
			//Hide/Show
			$("#"+divname).show("slow").siblings().hide("slow");
		});
	});
</script>
</head>
<body>
	<div id="buttonsDiv">
		<input type="button" id="button1" class="buttons" value="Video" />
		<input type="button" id="button#" class="buttons" value="Close" />
		<input type="button" id="button2" class="buttons" value="Video2" />
	</div>

	<div>
		<div id="Video" style="display:none"></div>
		<div id="Close" style="display:none"></div>
		<div id="Video2" style="display:none"></div>
	</div>
</body>
</html>

      
      

      
    

  

    
    

      
#8
        
        

      
السلام عليكم
اليك طريقة بسيطة لاضافة اي عدد من الفيديوهات تريدها
VideoPlay.zip

      
      

      
    

  

    
    

      
#9
        
        

      
اخي choclatboy الله يسلم هالليدين وفقك الله ويسر الله امرك و جمعنا واياك والمسلمين اجمعين في  جناته النعيم تمام 100% 
اتعبتك معي واشكرك كل الشكر على جهدك  :wub: ارقى التحية والعرفان الى شخصكم الكريم
لكن حاجة صغنووووووووونة الكود فقط لليوتيوب كيف اجعله يستدعي فيديو داخل iframe 
<object type="application/x-shockwave-flash" height="300" width="400" id="live_embed_player_flash" data="http://www.justin.tv/widgets/live_embed_player.swf?channel=steven_bonnell_ii" bgcolor="#000000"><param name="allowFullScreen" value="true" /><param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" /><param name="movie" value="http://www.justin.tv/widgets/live_embed_player.swf" /><param name="flashvars" value="channel=steven_bonnell_ii&auto_play=false&start_volume=25" /></object><a href="http://www.justin.tv/steven_bonnell_ii#r=-rid-&s=em" class="trk" style="padding:2px 0px 4px; display:block; width:345px; font-weight:normal; font-size:10px; text-decoration:underline; text-align:center;">Watch live video from Destiny - Starcraft 2 on Justin.tv</a>
مثلا فيديو Id تبعه اسمه Fun و الكود تبع الفيديو كما هو في الاعلى كيف يتم استدعاء الفيديو داخل الفريم (iframe)  :blush:

      
تم تعديل هذه المشاركة بواسطة نجوم الكون في 22 أبريل 2011 في 17:51

      

      
    

  

    
    

      
#10
        
        

      
فقط تقوم بتعديل الاسطر التالية لتناسب ما تريده
var _iframe = '<iframe title="YouTube video player" width="640" height="390" src="http://www.youtube.com/embed/';
_iframe += _videoId += '?rel=0" frameborder="0" allowfullscreen></iframe>';

      
      
1

      
    

  

    
    

      
#11
        
        

      
هنا المشكلة التعديل اني اقدر اعدل لكن كيف اضافة اكثر من فيديو غير تنسيقات اليوتيوب قد اضيف مثلا wmv او silverlight او object 
بارك الله فيك وشكرا على المساعدة

      
      

      
    

  

    
    
    
 مواضيع مشابهة