שלח תשובה

זירת השאלות

561
צפיות
20
תשובות

טעינת תמונה לזיכרון הדפדפן….

,‏ 11 ביוני, 2005

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

תודה מראש….

תגיות:

20 תשובות

  1. BuildHome הגיב:

    תשובה
    prePic = new Image();
    prePic.src = "somePic01.gif";

    אם יש לך כמות מסוימת של תמונות אז נסה להכניסן למערך ולעבור בלולאה על כולן בצורה כזו:
    var tmpImages = [];
    var arrImages = [
    "button1_over.gif","button2_over.gif",
    "button3_over.gif","button4_over.gif",    tmpImages[i] = new Image();
        tmpImages[i].src = arrImages[i];
    }

  2. בוב הגיב:

    תודה רבה, עוד שאלה…
    איך אני יכול לעשות שתמונת הרקע בתא בטבלה תתחלף כאשר העכבר עובר מעליה?
    ניסיתי כך

    prePic = new Image();
    prePic.src = "images/button1.jpg";
    prePic2 = new Image();
    prePic2.src = "images/button.jpg";

    <td background="images/button.jpg" onmouseover="this.background=Prepic;" onmouseout="this.background=Prepic2;>


    זה לא עובד לי, אני לא בטוח שאני מגדיר לרקע להתחלף בצורה נכונה, ואני גם לא בטוח שאני נגש ל Prepic נכון.
    אם משהו יכול לתקן אותי אני אשמח,

    תודה מראש…..

  3. BuildHome הגיב:

    נסה משהו כזה
    <td style="background-image:url(images/button.jpg);" OnMouseOver="this.style.backgroundImage='url(images/button1.jpg)';" OnMouseOut="this.style.backgroundImage='url(images/button.jpg)';">

  4. בוב הגיב:

    תודה אחי, יש לי רק בעיה אחת…
    אני כותב בראש העמוד כך:


    <SCRIPT language=JavaScript>
       prePic = new Image();
       prePic.src = "images/button.jpg";
       prePic2 = new Image();
       prePic.src2 = "images/button2.jpg";
    </SCRIPT>

    ואז בתא של הטבלה כך:

    <td onClick=location="system.html" OnMouseOver="this.style.backgroundImage=prePic;" OnMouseOut="this.style.backgroundImage=prePic2;">

    אך הדפדפן רושם לי שגיאה, אני פשוט לא יודע איך לגשת ל prePic אחרי שהגדרתי אותו.
    תודה מראש למי שיכול לתקן אותי.

  5. somebody הגיב:

    נסה ככה:


    <td onClick=location="system.html" OnMouseOver="this.style.background=images/button.jpg;" OnMouseOut="this.style.background=images/button2.jpg;">

    זה מה שאני עושה.
    לי יכול להיות זה טוען אבל אני לא יוכל ליבדוק בגלל שאני בודק על המחשב וזה טוען מהר גם בלי זה.
    אבל ככה אני עושה שבמעבר עכבר תיתחלף התמונה.
    אבל עדיף לעשות את זה ב css אם אתה משתמש בזה בתור קישור לאיזה מקום.

  6. somebody הגיב:

    שניה יש עוד משהו.


    onClick="location.href='system.html'"

    וכמו שאמרתי אני רואה אתה עושה את זה בתור קישור אז תעשה בcss ככה:


    <style type="text/css">
    .button{
      height:הגובה של השורה;
      width:100%;
    display:block;
    text-decoration:none;
    background-image:url(images/button2.jpg);
    /*שנה עוד או תוסיף למה שאתה רוצה..*/
    }
    .button:hover{
    background-image:url(images/button.jpg);
    }
    </style>

    זה הקוד css שמתאים לך….
    שנה רק או תוסיף אך שאתה רוצה.

  7. בוב הגיב:

    ניסיתי כך על השרת שלי…
    ובצד לקוח זה עובד איטי, אני צריך לדעת איך אפשר להשתמש ב-


    prePic = new Image();
    prePic.src = "button.jpg";

  8. בוב הגיב:

    ניסיתי כך…
    זה מה שהקובץ שלי מכיל:

    <head>
    <SCRIPT language=JavaScript>
       prePic = new Image();
       prePic.src = "images/button.jpg";
       prePic2 = new Image();
       prePic.src2 = "images/button2.jpg";
    </SCRIPT>
    </head>

    <body>
    <table><tr>
    <td onClick=location="system.html" OnMouseOver="this.style.backgroundImage=prePic;" OnMouseOut="this.style.backgroundImage=prePic2;">
    ………..
    ………..

    אך זה לא עובד…אתה יכול לראות למה?
    תודה…

  9. BuildHome הגיב:

    2 דברים
    1. איפה url בקוד?
    2. נסה להגדיר את שם משתנה התמונה עם ה-src ולא האובייקט.

  10. BuildHome הגיב:

    משהו כזה
    <td onClick=location="system.html" OnMouseOver="this.style.backgroundImage='url('+prePic.src+')';" OnMouseOut="this.style.backgroundImage='url('+prePic2.src+')';">

  11. בוב הגיב:

    תודה רבה זה עובד, אבל זה לא חלק…
    התמונה לא מתחלפת מיד יש השהיה של איזה חצי שניה כל פעם שהתמונה מתחלפת. יש דרך לעשות זאת חלק לגמרי?
    כמו בתפריטים האלה:

  12. BuildHome הגיב:

    אתה יכול לתת נתיב מלא לרקע
    אבל בעיקרון הם עובדים באותה צורה רק ב-CSS.
    כל התאים שם הם קישורים ואז הם פשוט עושים class רגיל ו-class של hover.

  13. somebody הגיב:

    נווווווו!!!
    זה מה שעשיתי לך.
    אתה צריך לשים את זה בתור קישור.!!!
    הינה:

    <style type="text/css">
    .button{
      height:הגובה של השורה;
      width:100%;
    display:block;
    text-decoration:none;
    background-image:url(images/button2.jpg);
    /*שנה עוד או תוסיף למה שאתה רוצה..*/
    }
    .button:hover{
    background-image:url(images/button.jpg);
    }
    </style>

    ואז אתה עושה:


    <a href="///" class="button">קישור</a>

  14. somebody הגיב:

    חחחח….
    אמרתי לו והוא אומר שזה לא פועל ואני בטוח שהוא שם את זה בתוך השורה במקום בלינק…

    ניראה לי אתה צריך לעבור על המדריך css באתר…(לא לbuildhome).

שלח תשובה