محاولة بسيطة لتقليد جزئي لشعار جوجل لهذا اليوم

خالد الحضري · 24-09-2011, 05:53 PM

السلام عليكم ،

رأيت شعار جوجل لهذا اليوم لإحياء الذكري الخامسة والسبعين لميلاد محرك العرائس الأمريكي جيم هانسون صانع برامج "المابيت شو" و"عالم سمسم" ، طبعا نقلت تلك المعلومة فقط و لا أعرف عنه شيئا

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

الغرض هو إعطاء فكرة لمن لا فكرة له عن طريقة تنفيذ هذه الحركات الجذّابة .

التطبيق بسيط جدا ، و مكتبة JQuery للجافاسكربت ، و الصورة مأخوذة من جوجل نفسه .

المثال الحي

و هذه الصورة

السورس موجودة في المثال .

بالتوفيق .

moh_elferg · 24-09-2011, 08:06 PM

جزاك الله كل خير يا خالد
وتم النشر في جروب جافا تار
http://www.facebook.com/groups/jdevorcl/

وضاء · 25-09-2011, 01:09 AM

و عليكم السلام و رحمة الله و بركاته .
حياك الله خالد كيف حالك؟
لو وضعت Span ووضعت عليها خلفية شفافة بنسبة 0% حتى اذا سحب الرسم لا يتم سحبه ، بهذه الطريقة سيسحب الخلفية الشفافة فلا يظهر شيء مع السحب و الافلاتة و الا فالان يمكن سحبه .

الامر الآخر عند حدث تحريك الفأرة فهو يتأخر قليلاً لذلك الأفضل التخلي عن الجافا سكريبت في تحريكه و انما عمل كلاسات بعدد الخلفيات الموجودة (جميع الحركات) و تغير فقط الكلاس عند مرور الفأرة على المنطقة مثلاً -145 درجة سيكون أخف و أسهل .

شكراً لك .

خالد الحضري · 25-09-2011, 09:47 AM

أهلا محمد ، حمزة

نعم أخي حمزة الإبداع في المسألة واسعة ، و بسبب الوقت قلت أعطي فكرة فقط و ليس تطبيق "محنّك"

شكرا لك ، و الحمد لله أنا بخير ، لعلّك أنت أيضا بخير .

حياكم الله .

أحمد العبد الله · 25-09-2011, 01:02 PM

إقتباس:

المشاركة الأصلية بواسطة خالد الحضري

أهلا محمد ، حمزة

نعم أخي حمزة الإبداع في المسألة واسعة ، و بسبب الوقت قلت أعطي فكرة فقط و ليس تطبيق "محنّك"

شكرا لك ، و الحمد لله أنا بخير ، لعلّك أنت أيضا بخير .

حياكم الله .

يمكن ايضًا ان تستعمل خرائط html
عدلت هذا الكود من هنا:
http://www.w3schools.com/tags/tryit....ryhtml_areamap

اعمل نسخ\لصق لتشاهد النتيجة:

كود PHP:

  <html>
<body>

<p>Click on the sun or on one of the planets to watch it closer:</p>

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" onmouseover="alert('sun')"  />
  <area shape="circle" coords="90,58,3" alt="Mercury"  onmouseover="alert('mercury')"   />
  <area shape="circle" coords="124,58,8" alt="Venus"   onmouseover="alert('venus')"  />
</map>

</body>
</html>

المواضيع المشابهه
الموضوع	كاتب الموضوع	القسم	الردود	آخر مشاركة
تـــــأمـــلات ميتـــاتـــقنية(محاولة بسيطة)	php-man	القسم العام	3	19-08-2011 05:10 AM
جوجل أدسنس ما يقبلني بعد أكثر من محاولة !	star wolf	القسم العام	8	27-03-2009 06:58 PM
مشكلة في المتواجدين لهذا اليوم	سعود القحطاني	الإصلاح والصيانة	0	04-05-2008 12:58 AM
محاولة بسيطة - جدا - للخيال العلمي ..	Egyptechno	التصميم والرسومات والمونتاج	3	18-04-2005 04:38 AM
(vB2) هاك عدد مشاركات العضو لهذا اليوم	al3arf	الإصلاح والصيانة	2	04-10-2003 05:37 PM

أدوات الموضوع
مشاهدة نسخة مطبوعة إرسال هذه الصفحة