דילוג לתוכן
  • דף הבית
  • קטגוריות
  • פוסטים אחרונים
  • משתמשים
  • חיפוש
  • חוקי הפורום
כיווץ
תחומים

תחומים - פורום חרדי מקצועי

💡 רוצה לזכור קריאת שמע בזמן? לחץ כאן!
  1. דף הבית
  2. תכנות
  3. איך אפשר לעמוד על dropdown-content שנמצא בתוך dropdown-content?

איך אפשר לעמוד על dropdown-content שנמצא בתוך dropdown-content?

מתוזמן נעוץ נעול הועבר תכנות
8 פוסטים 4 כותבים 201 צפיות
  • מהישן לחדש
  • מהחדש לישן
  • הכי הרבה הצבעות
התחברו כדי לפרסם תגובה
נושא זה נמחק. רק משתמשים עם הרשאות מתאימות יוכלו לצפות בו.
  • Sara RivkaS מנותק
    Sara RivkaS מנותק
    Sara Rivka
    כתב ב נערך לאחרונה על ידי
    #1

    Screenshot 2023-11-16 213850.png
    איך אפשר לעמוד על הקישורים שנמצאים בתוך המלבן התכלת?
    כל פעם שאני מנסה, המלבן נעלם...
    תודה!

    צדיק תמיםצ תגובה 1 תגובה אחרונה
    0
    • צדיק תמיםצ מנותק
      צדיק תמיםצ מנותק
      צדיק תמים
      השיב לSara Rivka ב נערך לאחרונה על ידי צדיק תמים
      #2

      @Sara-Rivka כדי שיוכלו לעזור כדאי להביא דוגמת קוד בסיסית שרואים בה את הבעיה באמצעות codepen (או באתר הזה לדוגמה אפשר ליצור מבנה של תקיה)

      Don’t comment bad code — rewrite it." — Brian W. Kernighan and P. J. Plaugher"
      טיפים

      תגובה 1 תגובה אחרונה
      4
      • dovidD מנותק
        dovidD מנותק
        dovid ניהול
        כתב ב נערך לאחרונה על ידי dovid
        #3

        ראשית, בHTML אין מושג ששמו dropdown, זו התנהגות שמשיגים על ידי CSS וJS, בד"כ על ידי ספריות כמו בוטסטרפ.
        ומכיון שיש עוד ספריות, צריך לציין את שם הספריה.
        שנית, כיון שיש כמה דרכים איך לעשות, כדאי לצרף קוד (אמיתי או דוגמה).
        (קוד מדביקים בהודעה כטקסט רגיל אבל שמים לפני ואחרי שורה עם שלושה טילדות ~~~ וככה זה מעוצב טוב).

        מנטור אישי למתכנתים (ולא רק) – להתקדם לשלב הבא!

        בכל נושא אפשר ליצור קשר dovid@tchumim.com

        תגובה 1 תגובה אחרונה
        3
        • Sara RivkaS מנותק
          Sara RivkaS מנותק
          Sara Rivka
          כתב ב נערך לאחרונה על ידי
          #4

          @צדיק-תמים @dovid
          מצורף פה הקוד.
          כמו כן מצורפים הקבצים: index.html style.css

          הקוד של הdropdown-content האפור- Milky. ובתוכו נמצא הקוד של התתי מחלקות כמו: חלב, גבינות וכו'

          <div id="dropDownMilky">
                          <a href="aaa">🥛 חלב וביצים</a>
                          <div id="dropContentMilky">
                              <div id="dropDownMilk">
                                  <a href="aaa">חלב</a>
                                  <div id="dropContentMilk">
                                      <a href="aaa">חלב טרי</a>
                                      <a href="aaa">משקאות חלב ויוגורט</a>
                                      <a href="aaa">חלב עמיד</a>
                                      <a href="aaa">תחליף חלב</a>
                                  </div>
                              </div>
                              <div id="dropDownChees">
                                  <a href="aaa">גבינות</a>
                                  <div id="dropContentChees">
                                      <a href="aaa">גבינה לבנה</a>
                                      <a href="aaa">גבינת קוטג'</a>
                                      <a href="aaa">גבינה צהובה</a>
                                      <a href="aaa">גבינה מלוחה</a>
                                      <a href="aaa">גבינת שמנת</a>
                                      <a href="aaa">גבינה מותכת</a>
                                      <a href="aaa">גבינה קשה</a>
                                  </div>
                              </div>
                              <div id="dropDownYogurt">
                                  <a href="aaa">יוגורט ומעדני חלב</a>
                                  <div id="dropContentYogurt">
                                      <a href="aaa">לבן ואשל</a>
                                      <a href="aaa">יוגורט לבן טבעי</a>
                                      <a href="aaa">יוגורט פרי, טעמים</a>
                                      <a href="aaa">גבינה מלוחה</a>
                                  </div>
                              </div>
                              <div id="dropDownRubber">
                                  <a href="aaa">חמאה שמנת ומרגרינה</a>
                                  <div id="dropContentRubber">
                                      <a href="aaa">חמאה</a>
                                      <a href="aaa">שמנת לבישול ואפיה</a>
                                      <a href="aaa">מרגרינה</a>
                                  </div>
                              </div>
                              <a href="aaa">ביצים</a>
                              <div id="dropDownSalads">
                                  <a href="aaa">סלטים</a>
                                  <div id="dropContentSalads">
                                      <a href="aaa">סלטי ירקות</a>
                                      <a href="aaa">אריסה וסחוג</a>
                                      <a href="aaa">סלטי דגים</a>
                                  </div>
                              </div>
                          </div>
                      </div>
          

          זה הקוד בCSS של הdropdown-content האפור:

          #dropDownMilky{
              display: inline-block;
          }
          #dropContentMilky{
              display: none;
              position: relative;
              background-color:#e8e8e8;
              border-radius: 3%;
              padding-left: 10%;
          }
          #dropDownMilky:hover #dropContentMilky{
              display: block;
              position: absolute;
              
          }
          #dropContentMilky a{
              display: block;
              margin-block: 10%;
          }
          

          זה הקוד בCSS של הdropdown-content התכלת:

          #dropDownMilk{
              display: block;
          }
          #dropContentMilk{
              display: none;
              position: relative;
              background-color:#8fc7ff;
              border-radius: 3%;
              right: 50%;
              left: 0%;
              padding: 1%;
              margin-bottom: 7%;
          }
          #dropDownMilk:hover #dropContentMilk{
              display: block;
              position: absolute;
              
          }
          #dropContentMilk a{
              display: block;
              margin-block: 10%;
          }
          
          תגובה 1 תגובה אחרונה
          0
          • WheneverW מנותק
            WheneverW מנותק
            Whenever
            כתב ב נערך לאחרונה על ידי
            #5

            אם אני מזיז את העכבר במהירות לחלק הכחול אני יכול לתפוס את החלון ולבחור מתוך הרשימה.
            כמה דקות אמצא פיתרון בעז"ה

            תגובה 1 תגובה אחרונה
            0
            • WheneverW מנותק
              WheneverW מנותק
              Whenever
              כתב ב נערך לאחרונה על ידי Whenever
              #6

              אם תורידי את ה margins זה יהיה הרבה יותר קל לתפוס. בגלל המרווח שיש בין הקישור של "חלב" לרשימה, הרשימה בורחת כשעוברים עם העכבר במרווח.
              בשביל נראות אפשר להשתמש פה ב padding.

              דרך אגב, יש פה הרבה DIV'ם ו ID. כדאי לנסות לעשות class לדברים שחוזרים על עצמם. זה יותר נוח לקריאה ב HTML וגם פחות עבודה בCSS.

              שבוע טוב!

              Sara RivkaS תגובה 1 תגובה אחרונה
              2
              • Sara RivkaS מנותק
                Sara RivkaS מנותק
                Sara Rivka
                השיב לWhenever ב נערך לאחרונה על ידי
                #7

                @Whenever לאילו margins כוונתכם?

                WheneverW תגובה 1 תגובה אחרונה
                0
                • WheneverW מנותק
                  WheneverW מנותק
                  Whenever
                  השיב לSara Rivka ב נערך לאחרונה על ידי
                  #8

                  @Sara-Rivka כתב באיך אפשר לעמוד על dropdown-content שנמצא בתוך dropdown-content?:

                  @Whenever לאילו margins כוונתכם?

                  }
                  #dropContentMilky a{
                      display: block;
                      margin-block: 10%;      
                  }
                  
                  תגובה 1 תגובה אחרונה
                  1

                  בא תתחבר לדף היומי!
                  • התחברות

                  • אין לך חשבון עדיין? הרשמה

                  • התחברו או הירשמו כדי לחפש.
                  • פוסט ראשון
                    פוסט אחרון
                  0
                  • דף הבית
                  • קטגוריות
                  • פוסטים אחרונים
                  • משתמשים
                  • חיפוש
                  • חוקי הפורום