kostenloser Webspace werbefrei: lima-city


Sprungmenü Größe ändern ?

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    n************1

    Hallo,

    kann man bei einem Sprungmenü die Breite ändern ??

    Danke im Voraus
    nils
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. b******a

    Was genau bezeichnest du als "Sprungmenü"? Falls es sich um reines HTML und CSS handelt, sollte das problemlos möglich sein. Es kann natürlich sein, dass du eventuell verwendete Hintergrundgrafiken anpassen musst.
  4. Autor dieses Themas

    n************1

    Ein Menü wie das oben rechts neben Zu Favouriten hinzufügen .
    Wenn man ein Text auswählt, dass sich dann etwas neues öffnet.
    Un die Breite des Menüs möchte ich ändern.
    Ich glaube es besteht nur aus HTML.
  5. Sorry, aber ich habe nicht die geringste Ahnung, was Du meinst. Wo obben rechts, welche Favoriten, welcher Text? Fragen über Fragen.

    FF
  6. Autor dieses Themas

    n************1

  7. k********c

    Du meinst ein Pulldown- oder Dropdown-Menü. Wer in Gottes Namen hat das den man Sprungmenü genannt?!?
    Ein Frosch kann springen oder ein Leopard. Aber ein Menü hab ich bisher nur aufklappen gesehen. :)

    Ich hab sowas mal geschrieben. Das funktioniert mit HTML und CSS.

    Ich poste hier mal ein paar Zeilen, die ich im Internet gefunden habe. Dieses Beispiel ist sehr übersichtlich und kurz.

    HTML

    <html>
    <head>
    	<title>Pulldownmenü Javascript - NAVIGATION</title>
    	<link rel="stylesheet" type="text/css" href="../css/navigationstyle_top.css">
    	<script type="text/javascript" src="../javascripte/navigation_top.js"></script>
    </head>
    <body bgcolor="#FFFFFF">
    	<br />
    <ul id="sddm">
        <li><a href="#" 
            onmouseover="mopen('m1')" 
            onmouseout="mclosetime()">Menu1</a>
            <div id="m1" 
                onmouseover="mcancelclosetime()" 
                onmouseout="mclosetime()">
            <a href="#">Unterpunkt1</a>
            <a href="#">Unterpunkt2</a>
            </div>
        </li>
        <li><a href="#" 
            onmouseover="mopen('m2')" 
            onmouseout="mclosetime()">Menu2</a>
            <div id="m2" 
                onmouseover="mcancelclosetime()" 
                onmouseout="mclosetime()">
            <a href="#">Unterpunkt1</a>
            <a href="#">Unterpunkt2</a>
            <a href="#">Unterpunkt3</a>
            </div>
        </li>
        <li><a href="#" 
    		onmouseover="mopen('m3')" 
            onmouseout="mclosetime()">Menu3</a>
            <div id="m3" 
                onmouseover="mcancelclosetime()" 
                onmouseout="mclosetime()">
    		<a href="#">Unterpunkt1</a>
    		<a href="#">Unterpunkt2</a>
            <a href="#">Unterpunkt3</a>
            <a href="#">Unterpunkt4</a>
    	</li>
        <li><a href="#">Menu4</a></li>
        <li><a href="#">FAQ</a></li>
    </ul>
    <div style="clear:both"></div>
    
    	
    </body>
    </html>


    CSS

    #sddm
    {	margin: 0;
    	padding: 0;
    	z-index: 30}
    
    #sddm li
    {	margin: 0;
    	padding: 0;
    	list-style: none;
    	float: left;
    	font: bold 11px arial}
    
    #sddm li a
    {	display: block;
    	margin: 0 1px 0 0;
    	padding: 4px 10px;
    	/* width: 60px; */
    	background: #4B737D;
    	color: #FFF;
    	text-align: center;
    	text-decoration: none}
    
    #sddm li a:hover
    {	background: #7D9BA0}
    #sddm div
    {	position: absolute;
    	visibility: hidden;
    	margin: 0;
    	padding: 0;
    	background: #EAEBD8;
    	border: 1px solid #5970B2}
    
    	#sddm div a
    	{	position: relative;
    		display: block;
    		margin: 0;
    		padding: 5px 10px;
    		width: auto;
    		white-space: nowrap;
    		text-align: left;
    		text-decoration: none;
    		background: #EAEBD8;
    		color: #000;
    		font: 11px arial}
    
    	#sddm div a:hover
    	{	background: #E20074;
    		color: #FFF}


    Javascript

    var timeout	= 500;
    var closetimer	= 0;
    var ddmenuitem	= 0;
    
    function mopen(id)
    {	
    	// cancel close timer
    	mcancelclosetime();
    
    	// close old layer
    	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
    
    	// get new layer and show it
    	ddmenuitem = document.getElementById(id);
    	ddmenuitem.style.visibility = 'visible';
    
    }
    // close showed layer
    function mclose()
    {
    	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
    }
    
    // go close timer
    function mclosetime()
    {
    	closetimer = window.setTimeout(mclose, timeout);
    }
    
    // cancel close timer
    function mcancelclosetime()
    {
    	if(closetimer)
    	{
    		window.clearTimeout(closetimer);
    		closetimer = null;
    	}
    }
    
    // close layer when click-out
    document.onclick = mclose;


    Kopiere den Code jeweils in deine Dateien und vergiss nicht die Pfad- und Dateinamen anzupassen.

    Ich hoffe ich konnte Dir helfen!
  8. Autor dieses Themas

    n************1

    Danke für die Antwort
    Ich hab die Codes mal ausprobiert.
    Das meine ich aber nicht. :frown:
    Schau mal unter der Seite nilsbierwirth.de.vu. Unter Gallery und dann über der Galerie ist das Menü.
    Dreamwevaer nennt es Sprungmenü.
    Und diese Breite möchte ich verändern.

    Gruß
    nils
  9. sonok

    Moderator Kostenloser Webspace von sonok

    sonok hat kostenlosen Webspace.

    Du meinst wohl ein Formular-Dropdown-Menü, dessen allgemeine Beschreibung es hier gibt

    http://de.selfhtml.org/html/formulare/auswahl.htm

    Beitrag zuletzt geändert: 29.6.2010 12:49:41 von sonok
  10. Autor dieses Themas

    n************1

    Ja genau das meine ich :wink:
    Aber beiselfhtml steht nicht wie man die Breite ändert, nur das man mit das Menü size 1 aktiviert.

    Beitrag zuletzt geändert: 29.6.2010 13:25:16 von nilsbierwirth1
  11. nilsbierwirth1 schrieb:
    Ja genau das meine ich :wink:
    Aber beiselfhtml steht nicht wie man die Breite ändert, nur das man mit das Menü size 1 aktiviert.


    Über die ID des "Sprungmenüs", kannst Du über einen neuen Selektor #jumpMenu die Auswahl über CSS ändern wie Du möchtest.
  12. k********c

    Das Beispiel, das ich vorhin gepostet habe sieht natürlich besser aus als das Standard-Dropdownmenü. Aber das kannst Du auch formatieren.

    Entweder direkt "Inline"

    <form action="select.htm">
      <p>
        <select name="top5" style="width:500px">
          <option>Heino</option>
          <option>Michael Jackson</option>
          <option>Tom Waits</option>
          <option>Nina Hagen</option>
          <option>Marianne Rosenberg</option>
        </select>
      </p>
    </form>


    oder du machst das in einer externen CSS. Aber da hast Du schon sicher was parat.
    Ändern musst Du hier nur den Wert in:

    style="width:500px"
  13. Autor dieses Themas

    n************1

    Okay genau das habe ich gemeint :wink:
    Danke :thumb:
  14. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!