aufklappender Iframe bei mouse-over

Fragen zu allen Themen rund ums Programmieren außerhalb von phpBB können hier gestellt werden - auch zu anderen Programmiersprachen oder Software wie Webservern und Editoren.
Antworten
-=ToReaDoR=-
Mitglied
Beiträge: 27
Registriert: 14.12.2004 16:14

aufklappender Iframe bei mouse-over

Beitrag von -=ToReaDoR=- »

Hallo !

Ich habe in unserem Clan-Forum die von Microsoft neu eingeführten XBox-gamercards eingebunden.
Und zwar per

Code: Alles auswählen

<iframe src="http://gamercard.xbox.com/{postrow.POSTER_NAME}.card" scrolling="no" frameBorder="0" height="95" width="204"></iframe>
in der viewtopic_body.tpl

Allerdings hätte ich gerne eine Lösung, bei der ein kleines beliebiges icon anstelle der gamercard exisitiert, welches beim mouse-over ein Aufklappen dieser gamercard produziert. So wie z.B. in diesem nicht-phpBB-Forum (über das XBox-Symbol under dem Avatar hovern).

Kann mir Jemand helfend unter die Arme greifen ? Wie muß der code aussehen, der ein Bild einfügt und beim mouse-over die gamercard (siehe code oben) aufklappt (wenn mouse wieder weg, dann auch gamercard weg) ?


Vielen Dank schonmal und Grüße,


-=ToReaDoR=-
Benutzeravatar
gloriosa
Mitglied
Beiträge: 13770
Registriert: 04.01.2005 20:23
Wohnort: Landeshauptstadt Erfurt

Hinweis

Beitrag von gloriosa »

Hallo,
Du solltest Dir besser erst einmal Gedanken machen Dein Board auf die aktuelle Version 2.0.18 zu upgraden. :wink:

Dazu findest Du in der >>> Update-Hilfe <<< und im Forum Installation und Update die entsprechenden Informationen !
Viele Grüße - gloriosa :D
Die einen schützen sich vor frischem Wind, während die anderen ihn nutzen.
Kein kostenloser MOD-Einbau usw. bzw. Support via PN, Email oder IRC !
AmShaegar
Mitglied
Beiträge: 408
Registriert: 09.07.2004 17:33

Beitrag von AmShaegar »

kleiner tipp: klappt nur im IE, im FF(FireFox) nicht...
-=ToReaDoR=-
Mitglied
Beiträge: 27
Registriert: 14.12.2004 16:14

Beitrag von -=ToReaDoR=- »

Vielen Dank für den Hinweis bezüglich des phpBB-updates, werde mich drum kümmern.

Bezüglich meiner Frage habe ich folgendes herausfinden können :(Quelltext eines Forums anzeigen lassen und dann in einer html-Datei solange herumprobiert, bis es funktioniert hat).

Code: Alles auswählen

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


<script language="JavaScript" type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>


</head>


<body bgcolor="#FFFFFF" text="#000000">


<div style='position:relative; float:left;'>
<a href='http://live.xbox.com/member/Lyzarr' target='_blank'onMouseOut="MM_showHideLayers('Layer1','','hide')" 

onMouseOver="MM_showHideLayers('Layer1','','show')">
<img src='images/xblive.gif'><div id='Layer1' style='position:absolute; float:right; top:0; right:-204; width:204px; background-color: #F1EFE2; 

layer-background-color: #ECE9D8; border: 1px solid #000000; visibility: hidden;'><iframe src='http://gamercard.xbox.com/Lyzarr.card' scrolling='no' 

frameBorder='0' height='140' width='204'>Lyzarr</iframe></div></div>


</body>
</html>
Dies erzeugt den gewünschten Effekt in einer html-Datei. Bei der Einbindung ins Forum bin ich jedoch gescheitert. (Dort habe ich natürlich meinen Gamertag (Lyzarr) immer durch "{postrow.POSTER_NAME}" ersetzt.)
Den unteren Teil habe ich an die gewünschte Stelle in der viewtopic_body.tpl eingefügt, aber wo packe ich die java-script Funktionen hin ?! Habe es bereits an verschiedenen Stellen probiert, in der overall_header.tpl schien es mir am besten aufgehoben :wink: , aber es hat nicht funktioniert. Kann mir bitte Jemand sagen, wo ich dies (ganz genau) einfügen muß ?!

besten Dank und Gruß,


-=ToReaDoR=-
Zuletzt geändert von -=ToReaDoR=- am 18.11.2005 10:36, insgesamt 4-mal geändert.
-=ToReaDoR=-
Mitglied
Beiträge: 27
Registriert: 14.12.2004 16:14

Beitrag von -=ToReaDoR=- »

@gloriosa
Ich habe nun erfolgreich das Forum auf die aktuelle Version geupdated, würdest Du mir nun bei meinem Problem helfen ?! :wink: :lol:

Folgendes habe ich beobachtet. In einem Beitrag bei dem noch keine Antworten existieren, funktioniert die Anzeige, sobald aber mindestens eine Antwort vorhanden ist, nicht mehr. (Internet Explorer)
Im Mozilla funktioniert es immer, aber der Layer klappt immer beim ersten Beitrag auf, auch wenn man den mouse-over bei einem anderen icon auslöst.
Hier ein Beitrag ohne Antworten (es funktioniert)
Hier einer mit Antworten (klappt nicht)

Bitte helft mir...


Grüße, -=ToReaDoR=-
-=ToReaDoR=-
Mitglied
Beiträge: 27
Registriert: 14.12.2004 16:14

Beitrag von -=ToReaDoR=- »

Und wieder ich,...

aufgrund meiner Erkenntnis (eins höher) , denke ich es liegt daran,

Code: Alles auswählen

onMouseOver="MM_showHideLayers('Layer1','','show')"> 
daß immer Layer1 angesprochen wird, die Ziffer hinter "Layer" müsste vermutlich aber immer dynamisch der entsprechenden Beitrags-Nr. innerhalb des Threads angepasst werden. So daß beim zweiten Beitrag eben Layer2 angesprochen wird, beim dritten dann Layer3, usw. (Würde das Verhalten im Mozilla erklären.)

Wie kann ich das realisieren ? Gibt es sowas wie "{postrow.POSTER_NAME}" im Hinblick auf die Beitragsnr. ?!
Antworten

Zurück zu „Coding & Technik“