Ergebnis 1 bis 8 von 8

Thema: Spry Menüleiste CS5 Verlauf

  1. #1
    HTML Newbie
    Registriert seit
    30.04.2012
    Beiträge
    5
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Spry Menüleiste CS5 Verlauf

    Hallo Zusammen,

    ich mache gerade meine Ausbildung zum Mediengestalter in Print. Habe also eigentlich mit HTML, CSS und dem ganzen Zeug nichts am Hut. Mein Chef wollte jetzt aber von mir, dass ich eine Internetseite erstelle. Habe mir auch schon total viele Übungsvideos angeschaut, aber so ganz durchblicken tu ich s noch nicht.

    Also zuerst habe ich mir in Photoshop einen grafischen Entwurf erstellt und dann die Slices in Dreamweaver reingezogen. Der Rest der Seite ist eine Spry-Menübar horizontal und ein Textfeld.

    Irgendwo habe ich gehört, dass man in ein Spry Menü keinen Verlauf nach rechts erstellen kann. Deswegen habe ich den Verlauf einzeln in Photoshop erstellt und daraus ein Slices gemacht, das ich dann einfach hinter der Menüleiste (im gleichen Tag) eingefügt habe.

    Das Problem ist aber, dass jetzt zwischen dem Verlauf-Bild und der Menüleiste ein dünner weißer Balken ist, und ich ihn einfach nicht wegbringe.

    Wäre super, wenn mir wer helfen würde.
    Lg, Steffi
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Angehängte Grafiken Angehängte Grafiken

  2. #2
    Bandit
    Gast

    Standard AW: Spry Menüleiste CS5 Verlauf

    Mit den Infos, die du hier lieferst, wird dir niemand helfen können. Idealerweise packst du den Kram auf irgendeinen Server, damit man sich das malansehen kann. Und auf die "Slicerei" solltest du besser verzichten und die Sachen vernünftig zusammenbauen.

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    30.04.2012
    Beiträge
    5
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Spry Menüleiste CS5 Verlauf

    Na gut, danke trotzdem. Auf den Trainings DVDs die ich mir angeschaut hab, wirds halt nur mit Slices erklärt. Und ehrlich gesagt, solls auch keine super perfekte Internetseite werden sondern nur was kleines. Auf n Server laden kann ich leider auch nicht, weil ich wie schon gesagt habe, null Ahnung hab. Aber den Quellcode oder die CSS kann ich kopieren, wenn das was helfen würde?!

  4. #4
    Bandit
    Gast

    Standard AW: Spry Menüleiste CS5 Verlauf

    Nur den HTML- und CSS-Code zu sehen, reicht vielleicht, aber besser wäre es, wenn man das Problem richtig sehen würde. Du könntest dir irgendwo Free-Webspace besorgen, z.B. hier http://www.bplaced.net/ und dann den Kram per FTP rüberkopieren und hier einen Link posten.

    Ich frage mich nur, wieso man so eine Aufgabe bekommt, wenn man null Ahnung davon hat. Entweder ist dein Chef durch den Wind oder du hast nicht den Mut gehabt, ihm zu sagen, dass du das nicht kannst. So oder, beides etwas gaga.

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    30.04.2012
    Beiträge
    5
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Spry Menüleiste CS5 Verlauf

    Ok. Also hier wäre der HTML-Code:

    <html>
    <head>
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>pbs_logos</title>
    <!-- TemplateEndEditable -->
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    <script type="text/javascript">
    function MM_preloadImages() { //v3.0
    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    function MM_swapImgRestore() { //v3.0
    var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    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_swapImage() { //v3.0
    var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
    if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    </script>
    <link href="../styles/arial_ueberschrift.css" rel="stylesheet" type="text/css">
    <link href="../styles/Pbs_beschreibung_h2.css" rel="stylesheet" type="text/css">
    <link href="../styles/h2.css" rel="stylesheet" type="text/css">
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <link href="../styles/rahmenhovers.css" rel="stylesheet" type="text/css">
    </head>


    <body bgcolor="#FFFFFF" leftmargin="10" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('../hover/logo_10.gif','../hover/logo_13.gif','../hover/logo_14.gif','../hover/logo_15.gif','../hover/logo_16.gif','../hover/logo_17.gif')">
    <div align="center" </div>
    <!-- Save for Web Slices (Pbs Markenpool grafischer Entwurf2.psd) -->
    <table id="Tabelle_01" width="1205" height="1595" border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td colspan="3">
    <img src="../Bilder/pbs2_01.gif" width="1204" height="60" alt=""></td>
    </tr>
    <tr>
    <td colspan="2" rowspan="2"><a href="../home.html"><img src="../Bilder/pbs2_03.gif" width="168" height="83" alt=""></a></td>
    <td width="1036">
    <img src="../Bilder/pbs2_04.gif" width="1036" height="56" alt=""></td>

    </tr>
    <tr>
    <td rowspan="2"><ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="../home.html">Home</a> </li>
    <li><a href="#" class="MenuBarItemSubmenu">Unternehmen </a>
    <ul>
    <li><a href="../Allgemein.html">Allgemein</a></li>
    <li><a href="../struktur.html">Struktur</a></li>
    <li><a href="../vertriebskanaele.html">Vertriebskan&auml;le</a></li>
    </ul>
    </li>
    <li><a class="MenuBarItemSubmenu" href="#">Marken</a>
    <ul>
    <li><a href="../schneider.html">Schneider</a> </li>
    <li><a href="../novus.html">Novus</a></li>
    <li><a href="../dahle.html">Dahle</a></li>
    <li><a href="../herma.html">Herma</a></li>
    <li><a href="../aristo.html">Aristo</a></li>
    <li><a href="../rechner.html">Rechner</a></li>
    </ul>
    </li>
    <li><a href="../kontakt.html">Kontakt</a></li>
    </ul>
    <img src="../Bilder/pbs22_06.gif" width="302" height="28" alt="verlaufsbalken"></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="27" alt=""></td>
    </tr>
    <tr>
    <td colspan="2">
    <img src="../Bilder/pbs2_06.gif" width="168" height="1" alt=""></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="1" alt=""></td>
    </tr>
    <tr>
    <td width="168">
    <img src="../Bilder/pbs2_07.gif" width="167" height="26" alt=""></td>
    <td colspan="2">&nbsp;
    </td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="26" alt=""></td>
    </tr>
    <tr>
    <td rowspan="2"><a href="../schneider.html"><img src="../Bilder/pbs2_09.gif" alt="" name="schneiderlogo" width="167" height="58" id="schneiderlogo" onMouseOver="MM_swapImage('schneiderlogo','','../hover/logo_10.gif',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td colspan="2"> <blockquote><!-- TemplateBeginEditable name="ueberschrift" -->
    <h1>Pbs Markenpool</h1>
    <!-- TemplateEndEditable --></blockquote></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="56" alt=""></td>
    </tr>
    <tr>
    <td colspan="2" rowspan="7"><!-- TemplateBeginEditable name="textundbildfeld" -->
    <blockquote>
    <p>g</p>
    </blockquote>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <!-- TemplateEndEditable --></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="2" alt=""></td>
    </tr>
    <tr>
    <td><a href="../novus.html"><img src="../Bilder/pbs2_12.gif" alt="" name="novuslogo" width="167" height="58" id="novuslogo" onMouseOver="MM_swapImage('novuslogo','','../hover/logo_13.gif',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="58" alt=""></td>
    </tr>
    <tr>
    <td><a href="../dahle.html"><img src="../Bilder/pbs2_13.gif" alt="" name="dahlelogo" width="167" height="69" id="dahlelogo" onMouseOver="MM_swapImage('dahlelogo','','../hover/logo_14.gif',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="69" alt=""></td>
    </tr>
    <tr>
    <td><a href="../herma.html"><img src="../Bilder/pbs2_14.gif" alt="" name="hermalogo" width="167" height="54" id="hermalogo" onMouseOver="MM_swapImage('hermalogo','','../hover/logo_15.gif',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="54" alt=""></td>
    </tr>
    <tr>
    <td><a href="../aristo.html"><img src="../Bilder/pbs2_15.gif" alt="" name="aristologo" width="167" height="74" id="aristologo" onMouseOver="MM_swapImage('aristologo','','../hover/logo_16.gif',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="74" alt=""></td>
    </tr>
    <tr>
    <td><a href="../rechner.html"><img src="../Bilder/pbs2_16.gif" alt="" name="rechnerlogo" width="167" height="56" id="rechnerlogo" onMouseOver="MM_swapImage('rechnerlogo','','../hover/logo_17.gif',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="56" alt=""></td>
    </tr>
    <tr>
    <td>
    <p><img src="../Bilder/pbs2_17.gif" width="167" height="597" alt=""></p></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="597" alt=""></td>
    </tr>
    <tr>

    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1" height="458" alt=""></td>
    </tr>
    <tr>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="167" height="1" alt=""></td>
    <td width="1">
    <img src="../Bilder/Abstandhalter.gif" width="1" height="1" alt=""></td>
    <td>
    <img src="../Bilder/Abstandhalter.gif" width="1036" height="1" alt=""></td>
    </tr>
    </table>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>


    sorry falls er verwirrend und total unordentlich ist...

    und das ist der CSS-Code vom Spry-Menü:

    @charset "UTF-8";
    ul.MenuBarHorizontal
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 16px;
    cursor: default;
    width: inherit
    }

    ul.MenuBarActive
    {
    z-index: 1000;
    }
    ul.MenuBarHorizontal li
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 8.6em;
    float: left;
    }
    ul.MenuBarHorizontal ul
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 8.6em;
    position: absolute;
    left: -1000em;
    }
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    {
    left: auto;
    }
    ul.MenuBarHorizontal ul li
    {
    width: 8.6em;
    }
    ul.MenuBarHorizontal ul ul
    {
    position: absolute
    margin: -5% 0 0 90%
    }
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    {
    left: auto;
    top: 0;
    }

    ul.MenuBarHorizontal a
    {
    display: block;
    cursor: pointer;
    background-color: #CCC;
    padding: 0.3em 0.9em;
    color: #000;
    text-decoration: none;
    font-family: Arial
    }
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    {
    background-color: #CCC;
    color: #FFF;
    }
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    {
    background-color: #CCC;
    color: #FFF;
    }


    ul.MenuBarHorizontal iframe
    {
    position: absolute;
    z-index: 1010;
    }
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
    {
    background-image: url(SpryMenuBarDown.gif);
    background-repeat: no-repeat;
    background-position: 2% 50%;
    }
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    {
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 2% 50%;
    }
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    {
    background-image: url(SpryMenuBarDownHover.gif);
    background-repeat: no-repeat;
    background-position: 2% 50%;
    }
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    {
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 2% 50%;
    }
    @media screen, projection
    {
    ul.MenuBarHorizontal li.MenuBarItemIE
    {
    display: inline;
    f\loat: left;
    background: #FFF;
    }
    #Tabelle_01 tr td blockquote h1 {
    font-size: 18px;
    }
    #Tabelle_01 tr td blockquote h3 {
    font-size: 14px;
    }
    .normal {
    font-family: Arial;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    line-height: 23px;
    }
    .normal .normal {
    line-height: 16px;
    }

    Wenn dir das nichts bringt, dann versuch ich s mal mit bplaced. aber kann die website dann jeder sehen?

  6. #6
    Bandit
    Gast

    Standard AW: Spry Menüleiste CS5 Verlauf

    Irgendwie habe ich bei den Begriffen "Photoshop", "Slicen" und "Dreamweaver" mit so einer Katastrophe gerechnet. Das ist einfach nur grausam und meilenweit vom Stand der Technik entfernt.

    Klar kann jeder, der den Link hier liest, die Website bei bplaced sehen.

  7. #7
    HTML Newbie
    Themenstarter

    Registriert seit
    30.04.2012
    Beiträge
    5
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Spry Menüleiste CS5 Verlauf

    Okey. dann versuch ich mein Glück mal lieber in einem Dreamweaver Forum Vielleicht können die ja eher was damit anfangen Danke

  8. #8
    Bandit
    Gast

    Standard AW: Spry Menüleiste CS5 Verlauf

    Die werden dir nix anderes sagen. Das ganze Tabellen-Layout ist einfach Schrott und mehrfaches <p>&nbsp;</p> macht die Sache auch nicht besser. Das ist das Problem mit Dreamweaver. Jeder glaubt, damit könne er eine Seite zusammenschnitzen und dann kommt sowas bei raus.

Ähnliche Themen

  1. Spry Menu; Drop Down Arrows anpassen
    Von Der kleine Frosch im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 05.11.2011, 22:47
  2. Menüleiste verlinken
    Von StefanLutz im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 27.12.2009, 19:36
  3. Spry Accordion
    Von basu im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 31.08.2009, 16:48
  4. menüleiste
    Von error im Forum HTML & CSS Forum
    Antworten: 8
    Letzter Beitrag: 07.06.2007, 15:06
  5. verschachtelte Menüleiste
    Von Oracle007 im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 10.05.2006, 00:38

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •