شاطر
استعرض الموضوع السابقاذهب الى الأسفلاستعرض الموضوع التالي
avatar
مؤسسي المركز
مؤسسي المركز
القوس
عدد المساهمات : 330
متصفح الويب : Chrome
منتدى نسخة : PhpBB3
النقاط : 518
السٌّمعَة : 49
تاريخ التسجيل : 03/06/2015
العمر : 23
معاينة صفحة البيانات الشخصي للعضوhttp://www.t-mrkz.com/

default جافا سكربت تغير الصورة عن المرور عليها

في الأحد سبتمبر 13, 2015 7:14 am
السلام عليكم


أقدم لكم كود رائع يقوم بتغير الصورة عن المرور عليها الى أي صورة أخرى


كود يقبل في التومبلايت واي مكان يقبل اكواد HTML

الكود:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<img src="http://dummyimage.com/100x100/000000/ffffff&text=Image+1"
       data-hover="http://dummyimage.com/100x100/ffffff/000000&text=Image+2"
       data-out="http://dummyimage.com/100x100/000000/ffffff&text=Image+1" />

كود الجافا سكربت
الكود:
  $('img').on('mouseover',function () {
        var data = $(this).attr('data-hover');
        $(this).attr("src", data); // data-hover
    })
    $('img').on('mouseout', function() {
        var data = $(this).attr('data-out');
        $(this).attr("src", data); // data-out
    });


Like a Star @ heaven لتغير الصورة الأولى ابحث على http://dummyimage.com/100x100/000000/ffffff&text=Image+1 
Like a Star @ heaven لتغير رابط الصورة الثانية  http://dummyimage.com/100x100/ffffff/000000&text=Image+2
cheers
عضو جديد
عدد المساهمات : 47
النقاط : 49
السٌّمعَة : 0
تاريخ التسجيل : 20/07/2015
معاينة صفحة البيانات الشخصي للعضو

default رد: جافا سكربت تغير الصورة عن المرور عليها

في الإثنين مارس 07, 2016 6:28 am
طرحت فأبدعت يعطيك الف عافية
جهود مبارك جزاك الله خير
دمت ودام عطائك
ودائما بأنتظار جديدك الشيق
لك خالص تقديري واحترامي
دمت بخير
استعرض الموضوع السابقالرجوع الى أعلى الصفحةاستعرض الموضوع التالي
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى