اخر المواضيع

آخر الأخبار
‏إظهار الرسائل ذات التسميات سكربت جافا وبرمجه من غير روابط. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات سكربت جافا وبرمجه من غير روابط. إظهار كافة الرسائل

الجمعة

يحسب عدد تصفحك وتنقلك

 جافا سكربت

<center>

<script>

var times=history.length;

document.write(' عدد تصفحك '+times+' الان');

</script>

</center>

حطه في اي مكان

اقرأ المزيد
بواسطه : التاريخ : ليست هناك تعليقات:
قسم :
author

برمجه هكركوز الازرار للاعلى والاسفل

نُضيف أزرار التمرير داخل index.html


<!-- أزرار أعلى/أسفل -->

<button onclick="scrollToTop()" class="scroll-btn top">🔝</button>

<button onclick="scrollToBottom()" class="scroll-btn bottom">🔻</button>


نُضيف تنسيق CSS خاص بها في style.css

.scroll-btn {

  position: fixed;

  right: 20px;

  background-color: #2c3e50;

  color: white;

  border: none;

  padding: 12px;

  border-radius: 50%;

  cursor: pointer;

  z-index: 100;

  font-size: 20px;

  box-shadow: 0 2px 8px rgba(0,0,0,0.3);

  transition: background 0.3s;

}


.scroll-btn:hover {

  background-color: #1abc9c;

}


.scroll-btn.top {

  bottom: 80px;

}


.scroll-btn.bottom {

  bottom: 20px;

}



نضيف دوال التمرير في script.js


function scrollToTop() {

  window.scrollTo({ top: 0, behavior: 'smooth' });

}


function scrollToBottom() {

  window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });

}


وسلامتكم


اقرأ المزيد
بواسطه : التاريخ : ليست هناك تعليقات:
قسم :
author

الاثنين

كود للبلوجر وضع اليوتيوب youtube

 حطه وين ما تبي وتغير فقط 3fXqzkFnXz4 بالسطر الاول ويمكنك تغير الصوره وتكبير الحجم لفيديو


برمجه labnol

الكود


<div class="youtube-player" data-id="3fXqzkFnXz4" />

<style>

.youtube-player {

  position: relative;

  padding-bottom: 56.25%;

  height: 0;

  overflow: hidden;

  max-width: 100%;

  background: #000;

  margin: 5px;

}


.youtube-player iframe {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 100;

  background: transparent;

}


.youtube-player img {

  object-fit: cover;

  display: block;

  left: 0;

  bottom: 0;

  margin: auto;

  max-width: 100%;

  width: 100%;

  position: absolute;

  right: 0;

  top: 0;

  border: none;

  height: auto;

  cursor: pointer;

  -webkit-transition: 0.4s all;

  -moz-transition: 0.4s all;

  transition: 0.4s all;

}


.youtube-player img:hover {

  -webkit-filter: brightness(75%);

  -moz-filter: brightness(75%);

  filter: brightness(75%);

}


.youtube-player .play {

  height: 72px;

  width: 72px;

  left: 50%;

  top: 50%;

  margin-left: -36px;

  margin-top: -36px;

  position: absolute;

   background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-hMsazPazOIAJS35UVv_05KxH0_fpCySwYvFz-eFU1bYvtd3butAB-dY5LRNRhSsV_gniohml-SQS_f2t4wd1-sXnZbJ2jz5FvSOaf2v_L-vz7Bu7hU61HsWGS54M-yWDzP0Gp3TuJ_Xy/s16000/play-button.png") no-repeat;

  cursor: pointer;

}


</style>

<script type='text/javascript'>

//<![CDATA[

/* Light YouTube Embeds by @labnol */

/* Web: https://www.labnol.org/ */


function labnolIframe(div) {

  var iframe = document.createElement("iframe");

  iframe.setAttribute(

    "src",

    "https://www.youtube.com/embed/" + div.dataset.id + "?autoplay=1&rel=0"

  );

  iframe.setAttribute("frameborder", "0");

  iframe.setAttribute("allowfullscreen", "1");

  iframe.setAttribute(

    "allow",

    "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"

  );

  div.parentNode.replaceChild(iframe, div);

}


function initYouTubeVideos() {

  var playerElements = document.getElementsByClassName("youtube-player");

  for (var n = 0; n < playerElements.length; n++) {

    var videoId = playerElements[n].dataset.id;

    var div = document.createElement("div");

    div.setAttribute("data-id", videoId);

    var thumbNode = document.createElement("img");

    thumbNode.src = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisBiDcw6_wphktRk-9Rom5nZ0_7QhU7qpWcAuuJN6pk7K9Vl6vA2bs4t8ETgh10ae9NS_f2RAenTbCZpJ5ivSPJK6hG5qlAPWvEqZ1qoLkpDdjr2iWlKxG9HesEDX6vKtLVz-fQk1VZuHv/s400/Foreigners-and-Arabs2.gif".replace(

      "ID",

      videoId

    );

    div.appendChild(thumbNode);

    var playButton = document.createElement("div");

    playButton.setAttribute("class", "play");

    div.appendChild(playButton);

    div.onclick = function () {

      labnolIframe(this);

    };

    playerElements[n].appendChild(div);

  }

}


document.addEventListener("DOMContentLoaded", initYouTubeVideos);


//]]>

</script></div>


وسلامتكم

اقرأ المزيد
بواسطه : التاريخ : ليست هناك تعليقات:
قسم :
author

السبت

يوتيوب وتويتر واستغرام وفيس بوكس بحركه مميزه لتواصل اربعه

اضافه مميزه وخفيفه بتغير اللون وتحطه باي مكان تحب
البحث عن
]]></b:skin>
فوقه
.social-links li {
  text-align: center;
  border: 1px solid #eee;
  margin-bottom: 30px;
  border-top: 0;
  box-shadow: -0.5px 1px 9px 0px #eee;
  padding: 58px 10px;
}
.social-links li.facebook {
  border-bottom: 5px solid #223f7b;
  color: #223f7b;
}
.social-links li i {
  font-size: 40px;
}
.social-links li a {
  background: #223f7b;
  color: #fff;
  transform: skew(-14deg,0);
  display: inline-block;
  padding: 1px 26px;
  padding-bottom: 5px;
  line-height: 28px;
  font-size: 15px;
  padding-left: 22px;
}
.social-links li p {
  margin-bottom: 14px;
}
.social-links li.instagram a {
  background: #8539b5;
}
.social-links li.twitter a {
  background: #1ea1ef;
}
.social-links li.youtube a {
  background: #cf1f1f;
}
.social-links li.instagram {
  border-bottom: 5px solid #8539b5;
  color: #8539b5;
}
.social-links li.twitter {
  border-bottom: 5px solid #1ea1ef;
  color: #1ea1ef;
}
.social-links li.youtube {
  border-bottom: 5px solid #cf1f1f;
  color: #cf1f1f;
}
========================
ضع الكود بالجافا سكربت بالمكان المناسب
========================
<div class="social-links">
<li class="facebook">
<i class="fa fa-facebook"></i>
<p>إنظم لصفحتنا على فايسبوك بالظغط على زر</p>
<span><a target="_blank" href="https://www.facebook.com/">إعجاب</a></span>
</li>
<li class="instagram">
<i class="fa fa-instagram"></i>
<p>إنظم لصفحتنا على الانستجرام بالظغط على زر</p>
<span><a target="_blank" href="https://www.instagram.com/">تابعنا</a></span>
</li>
<li class="twitter">
<i class="fa fa-twitter"></i>
<p>إنظم لصفحتنا على تويتر بالظغط على زر</p>
<span><a target="_blank" href="https://twitter.com/">متابعة</a></span>
</li>
<li class="youtube">
<i class="fa fa-youtube-play"></i>
<p>إنظم لقناتنا على يوتيوب بالظغط على زر</p>
<span><a target="_blank" href="https://www.youtube.com/">اشتراك</a></span>
</li>
</div>
ويمكنك وضع بالجافا سكربت :  ‏تهيئة HTML/JavaScript
<div class="abt-social-slide">
<ul>
<li><a class="facebook" href="#" target="_blank">Facebook</a></li>
<li><a class="twitter" href="#" target="_blank">Twitter</a></li>
<li><a class="google-p" href="#" target="_blank">Google plus</a></li>
<li><a class="rss" href="#" target="_blank">Rss</a></li>
</ul>
</div>
<style>
.abt-social-slide ul li{list-style:none;border-bottom:none;padding:0}
.abt-social-slide li a{width:59px;height:59px;float:left;text-indent:-99999px;border:solid 1px #222121;border-radius:5px;-webkit-transition:All .3s ease-out;-moz-transition:All .3s ease-out;-o-transition:All .3s ease-out;margin:5px 5px 10px;padding:0}
.abt-social-slide li a.facebook{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicwkxIRKWtZlXbipxzIQtW8dvClukLQJ-KrTJMFI9RBdziahmc_TO7lek8l03YLgr2tIGX87Co1IFMHQ68lvKAFk9V8k4JZahsaLuu-i6SVmOJjFh-AkWm7x7mnB_Uawef3xAxg_wzWg/s1600/facebook.png) no-repeat 0 -88px}
.abt-social-slide li a.facebook:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicwkxIRKWtZlXbipxzIQtW8dvClukLQJ-KrTJMFI9RBdziahmc_TO7lek8l03YLgr2tIGX87Co1IFMHQ68lvKAFk9V8k4JZahsaLuu-i6SVmOJjFh-AkWm7x7mnB_Uawef3xAxg_wzWg/s1600/facebook.png) no-repeat 0 0}
.abt-social-slide li a.twitter{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8wJA2AI0k-5Oh40KSIa2wvd3KlSQl-oKPIF6m1qu5mquBzllvIyWW8znm8OAMjgruYr6TzoZoFGNsIhpSZLjjxZ8rMUMreKIvalVRxXuohtpyp_LEKPIkugkBI_wcgxPHT6p_5lkKhg/s1600/twitter-1.png) no-repeat 0 -88px}
.abt-social-slide li a.twitter:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8wJA2AI0k-5Oh40KSIa2wvd3KlSQl-oKPIF6m1qu5mquBzllvIyWW8znm8OAMjgruYr6TzoZoFGNsIhpSZLjjxZ8rMUMreKIvalVRxXuohtpyp_LEKPIkugkBI_wcgxPHT6p_5lkKhg/s1600/twitter-1.png) no-repeat 0 0}
.abt-social-slide li a.google-p{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8bY2saa4FLYD0LQ9-W6ISMQYEmjPfEkOH-G19TB6ycIJk6rGrg1_VGio1gTs2o4TIflMNvWP4Xy8EF0xFo2XwNg-tG0bV-xBPtnEZOvOnFIH9wzIArSkzKgD7zQaU2bCKH6-jdT027g/s1600/google.png) no-repeat 0 -88px}
.abt-social-slide li a.google-p:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8bY2saa4FLYD0LQ9-W6ISMQYEmjPfEkOH-G19TB6ycIJk6rGrg1_VGio1gTs2o4TIflMNvWP4Xy8EF0xFo2XwNg-tG0bV-xBPtnEZOvOnFIH9wzIArSkzKgD7zQaU2bCKH6-jdT027g/s1600/google.png) no-repeat 0 0}
.abt-social-slide li a.rss{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5smmUsM-Nynecq-V_5bMPYK9HPozuMUgwUdBOuLZXaTI7n5Kz-ypIYoQd0C7d5Yt_WYwwljCcb2DE2GeqKJgFO8KUJfhMF4JXAyuvX36tqaF0t7wuMIuYGwNavev1nnydPcEyKVkWWA/s1600/twitter.png) no-repeat 0 -88px}
.abt-social-slide li a.rss:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5smmUsM-Nynecq-V_5bMPYK9HPozuMUgwUdBOuLZXaTI7n5Kz-ypIYoQd0C7d5Yt_WYwwljCcb2DE2GeqKJgFO8KUJfhMF4JXAyuvX36tqaF0t7wuMIuYGwNavev1nnydPcEyKVkWWA/s1600/twitter.png) no-repeat 0 0}
</style>
وسلامتكم 
اقرأ المزيد
بواسطه : التاريخ : ليست هناك تعليقات:
قسم :
author

الأحد

سكربت جافا وبرمجه من غير روابط Java script and programming without links

هنا وضع الجافا سكربت من غير روابط خارجيه
اتبع
اقرأ المزيد
بواسطه : التاريخ : ليست هناك تعليقات:
قسم :
author
الاشتراك في: التعليقات (Atom)

آلتآريخ هجري وميلآدي

المتابعون