احتاج مساعدة في جافاسكربت Javascrpt

اسماعيل الاطرش · 2 مارس 2019

السلام عليكم اخواني

احتاج مساعدة في برمجة جافاسكربت

اريد عند تمرير المؤشر (الماوس) فوق الايقونة تتغير صورتها الى صورة اخرى....افيدونا بارك الله فيكم

Entesar Khaled · 2 مارس 2019

أهلًا بك،

يمكن فعل ذلك بعدة طرق أبسطها أن تعطي أمر javascript في نفس السطر لوسم <img> باستخدام الخاصيتين onmouseover و onmouseout وبعد ضبط رابط صورتك الصحيح فينتج كالتالي

<a href="#" id="name">
    <img title="Hello" src="/ico/view.png" onmouseover="this.src='/ico/view.hover.png'" onmouseout="this.src='/ico/view.png'" />
</a>

إذا كنت تريد تغيير شكل أيقونه بوتستراب فيمكن فعل ذلك بخاصية css وهي hover كالتالي

<!DOCTYPE html>
<html>
  <head>
   <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
  </head>

  <body>
    <div class="container">
     <a href="#" class="lock">
    <i class="fa fa-unlock"></i>
    <i class="fa fa-lock"></i>
</a>
    </div>
    <style>
      .lock:hover .fa-unlock,
.lock .fa-lock {
    display: none;
}
.lock:hover .fa-lock {
    display: inline;
}
    </style>
  </body>
</html>

بالتوفيق..

اسماعيل الاطرش · 10 مارس 2019

شكرا بارك الله فيك

احتاج مساعدة في جافاسكربت Javascrpt

السؤال

اسماعيل الاطرش

رابط هذا التعليق

شارك على الشبكات الإجتماعية

2 أجوبة على هذا السؤال

Recommended Posts

Entesar Khaled

رابط هذا التعليق

شارك على الشبكات الإجتماعية

اسماعيل الاطرش

رابط هذا التعليق

شارك على الشبكات الإجتماعية

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية