Ergebnis 1 bis 3 von 3

Thema: Mousover bei Thumbnail neues Fenster mit grerem Bild ffne

  1. #1
    richi
    Gast

    Standard Mousover bei Thumbnail neues Fenster mit grerem Bild ffne

    Hallo,

    bin absuluter Neuling und schon seit 2 Tagen am Programieren.

    Ich versuche meine Thumbnails beim berfahren mit der Maus ein selbstpositioniertes Fenster (bsp. rechter Bildschirmrand Mitte) mit dem greren Bild darzustellen.
    Beim verlassen des Thumbnails soll sich das grere Fenster wieder schlieen.
    Da ich aber auch 2 verschieden Bildformate (hoch=480 und quer=512 und umgekehrt) habe sollten diese nicht verzerrt werden.

    Gibt es hierfr vielleicht eine einfache Lsung mit Beispiel?

    Wre echt toll wenn mir jemand dabei helfen knnte, ich verzweifle langsam.

    Lieben Gru
    freesy
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist lter als 90 Tage. Die darin enthaltenen Informationen sind mglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beitrge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Die Positions-, Gren- und Dateiangaben msstest du noch anpassen. Ansonsten sollte es klappen:
    CSS
    Code:
    a.info{
    
        position:relative;
        z-index:1;
        text-decoration:none;
        }
    
    a.info:hover{z-index:2;position:absolute;}
    
    a.info span{display: none;
    background-image: url(hoverbild.jpg);
    }
    
    a.info:hover span{
        display:block;
        position:absolute;
        top:2em; left:20em; width:150px;height:100px;
    }
    HTML

  3. #3
    HTML Newbie
    Registriert seit
    21.04.2007
    Beitrge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Danke dir, aber damit wird das Problem nicht gelst, habe seither viel experimentiert und dieses soweit hin bekommen, habe die CSS auch extern abgespeichert wo drauf zugegriffen wird...hier nur zu veranschaulichen:

    CSS

    Code:
    <style type="text/css">
    <div class="aussencontainer">
    a.info&#123;
        position&#58;relative;
        z-index&#58;1; background-color&#58;#ccc;
        color&#58;#000;
        text-decoration&#58;none&#125;
    
    a.info&#58;hover&#123;z-index&#58;2; background-color&#58;#ff0&#125;
    
    a.info span&#123;display&#58; none;&#125;
    
    a.info&#58;hover span&#123;
        display&#58;block;
        position&#58;absolute;
        top&#58;10em; left&#58;40em; width&#58;1em; height&#58;1px;
        border&#58;2px solid ccff;
        background-color&#58;#cff; color&#58;#000;
        text-align&#58; center&#125;
    </div>
    </style>
    HTML

    Was ich gerne mchte als CSS ist:


    JS "onclick" was ich aber nicht will:

    Code:
    <script language="JavaScript">
            <!--
    
    var nummer;
    bild = new Array&#40;"01.jpg","01.jpg","02.jpg","03.jpg","04.jpg","05.jpg","06.jpg"&#41;;
    
    
    
    function anzeige3&#40;nummer&#41;&#123;
    fensterchen = window.open&#40;"","seite","width=480,height=320,top=100,left=200",screenx="300",screeny="200",menubar="no"&#41;;
    fensterchen.document.open&#40;&#41;;
    fensterchen.document.write&#40;"<body topmargin='0' leftmargin='0' marginheight='0' marginwidth='0'>" + "[img]"+bild&#91;nummer&#93;+"[/img]"&#41;;
    fensterchen.document.close&#40;&#41;;
    &#125;
    
    function anzeige4&#40;nummer&#41;&#123;
    fensterchen = window.open&#40;"","seite","width=320,height=480,top=100,left=200",screenx="300",screeny="200",menubar="no"&#41;;
    fensterchen.document.open&#40;&#41;;
    fensterchen.document.write&#40;"<body topmargin='0' leftmargin='0' marginheight='0' marginwidth='0'>" + "[img]"+bild&#91;nummer&#93;+"[/img]"&#41;;
    fensterchen.document.close&#40;&#41;;
    &#125;
    
    
                    //-->
            </script>
    HTML

    Code:
    <td width="180" height="120" bgcolor="#000000">[img]klein/01.jpg[/img]</td>
        <td width="180" height="120" bgcolor="#000000">[img]klein/02.jpg[/img]</td>
        <td width="180" height="120" bgcolor="#000000">[img]klein/03.jpg[/img]</td>
    Wie du siehst brauche ich im HTML nicht mehr das groeFoto mit grenangaben eintragen, ebenso sind diese im JS-Script eingetragen.

    gibt es soetwas als CSS, das wre zu schn um wahr zu sein.

hnliche Themen

  1. Wie ffne ich ein Bild in einem neuen Frame?
    Von Hermann im Forum HTML & CSS Forum
    Antworten: 8
    Letzter Beitrag: 01.04.2008, 23:51
  2. Bilder in mousover-Fenster [Anderes Problem!!!]
    Von Starfighter im Forum HTML & CSS Forum
    Antworten: 11
    Letzter Beitrag: 11.06.2007, 16:13
  3. Neues Fenster mit Bild ffnen und die Hintergrungfrabe nder
    Von JanSchumacher im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 0
    Letzter Beitrag: 26.06.2006, 12:58
  4. h neues fenster?
    Von gelschter User im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 3
    Letzter Beitrag: 06.10.2005, 11:51
  5. neues Fenster
    Von wernerdeluxe im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 6
    Letzter Beitrag: 23.08.2004, 18:26

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhnge hochladen: Nein
  • Beitrge bearbeiten: Nein
  •