السلام عليكم
كيف يمكنني ان اقوم بالطلب من المتصفح ان يقوم بتنفيذ كود معين على عنصر معين عندما اقوم بالتمرير او النقر ... على عنصر اخر
شكراً
💖
سؤال في الhtml & css
لنفرض لدينا عنصر HTML هو p يحوي على نص، نضع له خاصية onclick ونمرر له دالة function ليتم تنفيذها عند النقر عليها.
وضمن الدالة نكتب الشيفرة المسؤولة عن تعديل عنصر آخر يجب أن يكون له معرف خاص مثلا id.
صممت لك مثال، بعد النقر على محتوى العنصر p الأول سيتغر لون النص في العنصر p الثاني:
<!DOCTYPE html>
<html>
<body>
<p onclick="myFunction()">Click me to change other color.</p>
<p id="demo">I will be blue</p>
<script>
function myFunction() {
document.getElementById("demo").style.color = "blue";
}
</script>
</body>
</html>
طيب اذا ضغطت على الزر واشتغل تمام . هل بامكاني ان اعود للحالة الاولى عند معاودة الضغط عيه
شكراً💖🖤
نعم بالطبع، حسب الحالة التي تعالجها، إن كان محتوى العنصر نص عليك حفظ النص السابق/ و إعادة وضعه.
إن كان تنسيق CSS يمكن عمل صنف css class مثلا:
ونستعمل الدالة addClass في جافاسكربت على العنصر المراد تعديل تنسيقه
addClass("red")
لحذفه:
removeClass("red")
الصنف:
.red {color: red}
يمكنك استخدام خاصية ال hover في css عند التمرير ، اما في حاله النقر فلن تتمكن باستخدام html او css وتحتاج الي js علي سبيل المثال
سيجيبك أحد المختصين في مجال البرمجة ولكن إلى ذلك الحين دعني أسألك لو أردت أن أبدأ في تعلم html & css من الصفر فما هي المصادر التي ترشحها لي؟
السلام عليكم
كل عام وانتم بخير
في البداية تعلمِ الاساسيات من اي قناة في اليوتيوب
لماذا من اي قناة ؟ لأن اساسيات هذه اللغات هي بسيطة جداً ولا تحتاج الى خبرة مسبقة كبيرة لشرحها وحتى تفيهمها
ولكن عليكِ باخذ اكثر من ثلاث دورات على الاقل تشرح الاساسيات .لماذا؟ لأنه لا توجد دورة تشرح جميع الاساسيات اي لا بد ان يغفل المقدم عن شيء ما . ستجدين معلومات جديدة في الكورس التالي عن نفس العنصر الذي ادعى مقدم الكورس الاول انه تكم عن كل تفاصيله .
اما الخبرة في هذا المجال فتكتسب من كورسات انشاء المشاريع .
النصيحة الرأيسية هي ان تحاولي جاهدة التعلم من خلال المحتوى الانجليزي / اضافة للخبرة الكبيرة فيه والمعلومات الغير موجودة في المحتوى العربي راح تتعلمي انجليزي ولكن اكيد ليس هذا هو السبب الرئيسي وانما من اجل الخبرة تخيلي : خاصية جعل الاطار متوهج لم اجدها في المحتوى العربي رغم انها لا تتعدى الخمس كلمات .
المصادر باختصار :بالنسبة لي تعلمت فقط من خلال اليوتيوب (خبرتي لا بأس فيها الآن) *حاولي الا تتعلمي من طالب وانما من مهندس او شخص لديه عدد مشتركين كبير مقارنة بزمن انشاء القناة (ما اريد اكطع ارزاق الناس ولا كان خليت قائمة باسماء القنوات الي ما تعرف تشرح 😁) (ولكن لا بأس بكل كورس انا تعلمت من كورس كامل خاصية واحدة اضفتها لخبرتي *لا يوجد شيء لا ينفع ) انا عن نفسي تابعت هواي ولقيت افضلهم قناة computer mind من خلال كورس تصميم المواقع الشامل فيها . كورس بسيط وقصير في البداية يشرح الاساسيات وبعدين يدخل في المشروع (هذا اقصى ما كدرت اوصل له لأن سبق وقلت ان المحتوى العربي ضعيف (التعلم من خلال اليوتيوب كافي جداً ولا حاجة لدورات مدفوعة $$$ )
*ترى ما طولت بالشرح..... صح؟
السلام عليكم
عليكم السلام ورحمة الله وبركاته.
كل عام وانتم بخير
وأنتم بخير.
في البداية تعلمِ الاساسيات من اي قناة في اليوتيوب لماذا من اي قناة ؟ لأن اساسيات هذه اللغات هي بسيطة جداً ولا تحتاج الى خبرة مسبقة كبيرة لشرحها وحتى تفيهمهاولكن عليكِ باخذ اكثر من ثلاث دورات على الاقل تشرح الاساسيات .لماذا؟ لأنه لا توجد دورة تشرح جميع الاساسيات اي لا بد ان يغفل المقدم عن شيء ما . ستجدين معلومات جديدة في الكورس التالي عن نفس العنصر الذي ادعى مقدم الكورس الاول انه تكم عن كل تفاصيله اما الخبرة في هذا المجال فتكتسب من كورسات انشاء المشاريع .
هل لديك اقتراح لقناة ما؟ قناة الزيرو مثلا؟
النصيحة الرأيسية هي ان تحاولي جاهدة التعلم من خلال المحتوى الانجليزي / اضافة للخبرة الكبيرة فيه والمعلومات الغير موجودة في المحتوى العربي راح تتعلمي انجليزي ولكن اكيد ليس هذا هو السبب الرئيسي وانما من اجل الخبرة تخيلي : خاصية جعل الاطار متوهج لم اجدها في المحتوى العربي رغم انها لا تتعدى الخمس كلمات .
نعم أتفق معك وأعاني جدًا من البحث في المحتوى العربي ولكن الزملاء هنا نصحوني بأكاديمية حسوب عندما سألت عن مصادر لتعلم أساسيات تحسين محركات البحث، ربما عليك أن تلقي نظرة أنت أيضًا.
المصادر باختصار :بالنسبة لي تعلمت فقط من خلال اليوتيوب (خبرتي لا بأس فيها الآن) *حاولي الا تتعلمي من طالب وانما من مهندس او شخص لديه عدد مشتركين كبير مقارنة بزمن انشاء القناة (ما اريد اكطع ارزاق الناس ولا كان خليت قائمة باسماء القنوات الي ما تعرف تشرح 😁) (ولكن لا بأس بكل كورس انا تعلمت من كورس كامل خاصية واحدة اضفتها لخبرتي *لا يوجد شيء لا ينفع ) انا عن نفسي تابعت هواي ولقيت افضلهم قناة computer mind من خلال كورس تصميم المواقع الشامل فيها . كورس بسيط وقصير في البداية يشرح الاساسيات وبعدين يدخل في المشروع (هذا اقصى ما كدرت اوصل له لأن سبق وقلت ان المحتوى العربي ضعيف (التعلم من خلال اليوتيوب كافي جداً ولا حاجة لدورات مدفوعة $$$ )
تمام سألقي نظرة على هذه القناة.
*ترى ما طولت بالشرح..... صح؟
عفية عليك أخي لا طولت ولا شي، مشكور
لا أعتقد أن دورات أكاديمية حسوب مدفوعة، ونعم لدي سؤال آخر فضلًا:
هل مواقع الووردبريس خيار جيد في التدوين؟ وهل الأفضل منها مواقع الـ php؟
ومشكور مقدمًا.
لانه يقول لك اختر لون الاطار ,اختر لون الخط ,كم زر تريد ,اكتب هنا ,اختر هكذا........ اقصد انه يستخدم من اجل السرعة ولهذا شبهته بالمايكرو
أعلم أن النقاش قد طال، معذرة..
لكن ما الخطب كذلك أن يكون الموقع معد بهذه الطريقة، ماذا سأخسر أنا كمبتدئة لو اعتمدت على الووردبريس؟ ففي كل الأحوال ليس لدي القدرة على تصميم موقعي الخاص من خلال الـ php ؟ فهل ألجأ لمبرمج لإنشاء موقع أم أعتمد على الووردبريس؟ وماذا لو أن لدي مدونتي أصلًا؟
لا اختي عفواً لا طال ولا شي .
اعتقد هذا الفيديو يوضح لماذا يجب الاعتماد على اللغات بدل من ادوات انشاء المواقع .
بالمناسبة اختي لغة php هي لغة برمجة وليست لغة تصميم .التصميم يتم بصور اساسية من خلال لغتي html و css والجافا سكربت غير ضرورية جداً في التصميم .
اذاً الووردبريس لا يمكنك من استعراض افكارك وانما هو لديه افكار وانت فقط تختار اماكنها في الموقع بيما لغات البرمجة امكانياتها لا محودة .
لا بأس بتعلم الووردبريس ولكن من الخطأ الاعتماد عليه (الووردبريس محدود)
?anythings more
العفو منك ما قصرت.
فهمت الفرق وفهمت وجهة النظر كذلك وسوف أطلع على الأمر بشكل أكثر تفصيلًا للتوقف على المميزات التي يمكنني الحصول عليها من برمجة الموقع بنفسي وما هي المميزات التي يحرمني منها موقع معد مسبقًا مثل الووردبريس.
يمكنك استعمال حدث الاستماع للتأثير على عنصر اخر عند النقر أو التمرير
<!DOCTYPE html>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<button id="btn">click</button>
<h1 id="title">title</h1>
<script>
const btn = document.getElementById('btn');
btn.addEventListener('click', () => {
document.getElementById('title').style.color = 'red';
setTimeout(function () {
document.getElementById('title').style.color = '';
}, 500);
});
btn.addEventListener('mouseover', () => {
document.getElementById('title').style.color = 'red';
setTimeout(function () {
document.getElementById('title').style.color = '';
}, 500);
});
</script>
التعليقات