עבור לתוכן

HTML יש דרך לשלוט ב Class של iframe ע"י כפתור?

Featured Replies

פורסם

שלום!

אז ככה:

באתר שלי יש תפריט ו 2 אייפרמים. (frame1,frame2)

בכפתור למעלה נגיד אני שמתי:

<a href="javascript:loadTwo('home.html','pic_home')">

והקוד ג'אווה הוא:

<script language="javascript">
function loadTwo(iframe1URL, iframe2URL)
{
parent.frame1.location.href=iframe1URL
parent.frame2.location.object.className=iframe2URL
}
</script>

אני עושה משהו לא נכון לא יודע מה...חרשתי על גוגל שעות לא מצאתי פתרון..מישהו יודע משהו?

תודה! :xyxthumbs:

פורסם
  • מחבר

יש את האייפריים הראשי שבוא מופיעים עמודי ה html שהכנתי, ומשמאל

ישנו אייפריים נוסף שמציג תמונה שמשתנה בהתאם לעמוד שרואים(ע"י לחיצה

על הכפתורים למעלה בתפריט הראשי).

עכשיו אני לא רוצה לטעון תמונה ישר לתוך האייפריים כי זה מעוות לה את המימדים

משום מה ומתעקש לשים scroll או מגדירים noscroll אז פשוט חותך את התמונה ולא

ממקם אותה נכון לא משנה מה אני עושה.

לכן אני מעדיף להראות אותו דרך css שגם ככה אני עושה כל עם CSS. למשל:

.

pic_1 {
background-image: url(images/index_12.png);
background-repeat: no-repeat;
background-position: center top;
}
.pic_home {
background-image: url(images/pic_01.jpg);
background-repeat: no-repeat;
background-position: center top;
}

מקווה שאני ברור עכשיו..

פורסם

אתה סך הכל רוצה כפתור שיחליף בין תמונות?

כי מה שעשית עם הפריימים זה ממש אוברקיל

אתה יכול לעשות משהו כזה:

<a href="" onMouseOver="document.MyImage.src='image2.gif';" onMouseOut="document.MyImage.src='image1.gif';">

This is linked text

</a>

<img src="image1.gif" name="MyImage">

רק במקום mouseover תעשה click

פורסם
  • מחבר

לא לא...

זה לא טוב ככה..אני צריך שישלוט על ה Iframe דרך CSS בלבד.

אין שום דרך אחרת, רגיל זה דופק מיקום וגודל וגם אם מכריחים אותו

זה לא עובד. גם ככה אני מעדיף לעבוד רק עם CSS להכל.

בכל אופן אני יודע שזה ככה איכשהו אבל אני טועה במשהו בקוד שם..

בכל מקרה תודה על מה שרשמת...הגיוני לעשות את זה ככה מבוסס על שלך? :

<a href="#" onClick="document.frame2.class=pic_home;">

בכל אופן, יש איזה פתרון עם פונקצית ה javascript שלי ?

פורסם

הגיוני לעשות את זה ככה מבוסס על שלך? :

<a href="#" onClick="document.frame2.class=pic_home;">

בהחלט, רק במקום class זה צריך להיות className

פורסם
  • מחבר

מצטער אבל זה לא עובד פשוט... :kopfpatsch::s07:

הנה מה שעשיתי :

הקוד לחיצה שיושב על תמוה בתפריט:

<a href="#" onClick="document.frame2.className=pic_home;">

הקוד של האייפרים שצריך לשנות לה את הCSS:

<iframe name="frame2" src="stam.html" class="pic_1" frameborder="0" vspace="0" hspace="0" height="100%" width="100%" scrolling="auto">
Your browser doesnt support iframes</iframe>

השם של הCLASS הוא pic_home, וכל כפתור משתמש ב CLASS שישנה את הCLASS הקודם שהיה ב frame2

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

פונקצית javascript, אבל בכל אופן גם כמו שהראית לי לא עובד וזה תמוהה..

פורסם

שאלה דבילית:

כתבת בכלל בקובץ CSS את הקלאס pic_home?

פורסם
  • מחבר

אני מבין שאתה שואל, כן, כתבתי.

אני לא מתחיל, אני יודע טוב מאוד CSS ו html פשוט

אני חדש מאוד עם javascript.

בכל אופן, יש לך רעיון ? בטוח יש דרך לשלוט על class של אייפריים..

פורסם

אתה לא צריך לשנות את הCSS של הפריימ, אלא של הDOCUMENT שלו.

כשאתה מנסה לשנות את הSTYLE שלו, אתה רוצה בעצם לשנות את הגבולות שלו ודברים כאלה.

פורסם
  • מחבר

לא הבנתי אותך..

הרי התמונה שלי מוגדרת ב CSS כך :

.pic_1 {
background-image: url(images/index_12.png);
background-repeat: no-repeat;
background-position: center top;
}
.pic_home {
background-image: url(images/pic_01.jpg);
background-repeat: no-repeat;
background-position: center top;
}

מזה ה Document שלו..תסביר לי זה מעניין.

בכל אופן, יש לך אופציה בשבילי שזה יעבוד ?

פורסם

זה עובד אצלי:

   <style type="text/css">
.first
{
background: url("/images/pic1.png") left no-repeat;
}
.second
{
background: url("/images/pic2.png") left no-repeat;
}
</style>
<script language="JavaScript">
function change(id, newClass) {

identity=document.getElementById(id);

identity.className=newClass;

}
</script>
<iframe class="first" id="changeme"></iframe>
<br />
<a href="javascript:;" onClick="change('changeme', 'second');">Pic2</a> | <a href="javascript:;" onClick="change('changeme', 'first');">Pic1</a>

פורסם
  • מחבר

גאוני!!

אתה תותח :xyxthumbs:

עכשיו רק תסביר לי שאני ידע מה אני עושה אני לא אוהב לעבוד כמו תוכי..

א. מה ההבדל אין name ל ID ?

ב. identity=document.getElementById(id);

מה מתבצע בפקודה הזו?

תודה רבה רבה!

יאיר

פורסם

א. מה ההבדל אין name ל ID ?

ב. identity=document.getElementById(id);

א. אין איזשהו הבדל מהותי, אבל יכול להיות שיש להם הבדלים בין IE ל-FF למרות שאני לא בטוח בזה

ב. identity זה סתם משתנה ביניים

היה גם אפשר לעשות בשורה אחת:

document.getElementById(id).className=newClass

פורסם
  • מחבר

סבבה..!!

עובד מעולה, רק השאלה שלי היתה מה הפקודה

document.getElementById(id);

אומרת טכנית

ארכיון

דיון זה הועבר לארכיון ולא ניתן להוסיף בו תגובות חדשות.

דיונים חדשים