mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Mo 05.12.2016 13:51 Benutzername: Passwort: Auto-Login

Thema: Häßliche Ränder im Menüscript und ich bekomme sie nicht weg vom 24.01.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Häßliche Ränder im Menüscript und ich bekomme sie nicht weg
Autor Nachricht
Denise_van_Hoorn
Threadersteller

Dabei seit: 24.01.2006
Ort: Berlin
Alter: -
Geschlecht: Weiblich
Verfasst Di 24.01.2006 16:34
Titel

Häßliche Ränder im Menüscript und ich bekomme sie nicht weg

Antworten mit Zitat Zum Seitenanfang

Hallo allerseits... Mädchen!

ich habe ein vielleicht bei einigen sehr bekanntes und wie ich meine gutes Javascript gefunden (Sliding Menu von ScriptBreaker.com (Webseite nicht mehr existent)) und mein eigenes Menü daraus gebastelt (http://www.mcglencairn.de/inhalt.html)
Es besteht aus grafischen Elementen, die gleich einer Pergamentrolle aufgezogen werden. Leider sind häßliche Zwischenräume zu sehen, die ich nicht wegbekomme. Ursachen dafür sind viele:

Ich kann kein Java (nur Basic) Lächel ) und kapiere den JavaScript-Code nicht.
Ich verstehe kaum CSS und habe schon vieles probiert, leider ohne den gewünschten Erfolg. Ich habe zwar ein wenig mit CSS erreichen können, vieles nachgeschaut, die häßlichen Zwischenräume aber bleiben.

Ich habe das Internet abgesucht, u.a. gegoogle'd nach "ScriptBreaker" und habe mir vieles durchgelesen, was dazu zu finden war, war ua. auf "SelfHTML" und diversen anderen zum Thema CSS bzw. Java doch habe ich keine Lösung gefunden, die das Problem hätte beseitigen können. Habe viele Parameter temporär verändert, um zu schauen, was sie bewirken.
Ich habe die Parameter im "inhalt.html" beim
Code:
<img src="..." height="">
erhöht oder verringert, dann wird es zwar im Firefox schick angezeigt, der dußliche IE allerdings behält die Zwischenräume und schiebt das "Impressum" unter die unterste Grafik.

Jetzt bin ich am Ende mit meiner Weisheit. * Nee, nee, nee * Vielleicht hat jemand von Euch ein paar Stichworte zu denen ich nachschauen kann oder einen Tipp wo es hakt.

Wie bekomme ich die Zwischenräume weg? *hu hu huu*


Habt Dank für Eure Hilfe.

Denise

-----


Hier der Code der Webseite "inhalt.html":

Code:

  <html><head>
  <title>McGlecairn-Inhalt</title>
  <style>
  .menu
  {
   position:relative;
   width:242;
   font-size:0px;
   font-family:Arial;
   color: #00ff00;
   position:absolute;
   cursor:se-resize;
  }
  .item_panel
  {
   background-color: #ff0000;
   width:242;
   clip:rect(0,242,0,-30);
   position:absolute;
  }
  .item_panel a
  {
   text-decoration:none;
   color:black;
   cursor:hand;
  }
  .item
  {
   width:242;
   font-size:0px;
   color: #0000ff;
   font-family:arial;
  }
  </style></head>
  <body style="background-image:url(./grafiken/bricks.jpg)">
 
<table cellpadding="0" cellspacing="0" border="0"><tr>
   <td> <script language="JavaScript" src="./js/sliding_menu.js" type="text/javascript"></script>
  <script language="JavaScript" type="text/javascript">
      //Link[nr] = "position [0 is menu/1 is item],Link name,url,target (_blank|_top|frame_name)"
  var Link = new Array();
Link[0]  = "0|<img src='./grafiken/menu/rolle_oben.gif' width='242' height='46' border='none'>";
Link[1]  = "1|<img src='./grafiken/menu/home.gif' width='242' height='25' border='0'>|./home.html|mainFrame";
Link[2]  = "1|<img src='./grafiken/menu/mcglencairn--.gif' width='242' height='25' border='0'>|./cfg_surroundings.php|mainFrame";
Link[3]  = "1|<img src='./grafiken/menu/ausstattung__.gif' width='242' height='25' border='0'>|./cfg_mail.php|mainFrame";
Link[4]  = "1|<img src='./grafiken/menu/aktionen.gif' width='242' height='25' border='0'>|./cfg_numbers.php|mainFrame";
Link[5]  = "1|<img src='./grafiken/menu/galerie.gif' width='242' height='25' border='0'>|./php/cpg143/index.php|mainFrame";
Link[6]  = "1|<img src='./grafiken/menu/anfrage.gif' width='242' height='25' border='0'>|./cfg_date.php|mainFrame";
Link[7]  = "1|<img src='./grafiken/menu/gaestebuch.gif' width='242' height='25' border='0'>|./php/allmyguests/index.php|mainFrame";
Link[8]  = "1|<img src='./grafiken/menu/links.gif' width='242' height='25' border='0'>|./php/allmylinks/index.php|mainFrame";
Link[9]  = "1|<img src='./grafiken/menu/impressum.gif' width='242' height='25' border='0'>|./cfg_broken.php|mainFrame";
Link[10]  = "0|<img src='./grafiken/menu/rolle_unten.gif'>";
startup("1");

// startup(); to see no default items
// startup("all"); to open all the items at the pageload
// startup("1|2"); to open the first and the second item_panel
// startup("4"); to open the fourth item_panel
 </script>

 </td>
 </tr>
 </table><p>

  </body>
  </html>


Hier das dazugehörige JavaScript:

Code:


//free JavaScripts on http://www.ScriptBreaker.com
 
 var open_close = true// true or false, false = close the previous item_panel first when opening a new one
 
  var height = 45; // height of the menu headers
  var iheight = 27; // height of the menu_items
 
 
 
 
 
  var speed = 1; // time between changing heigth of the item_panel
  var steps = 1; // changing heigth in steps of
  var timerID = "";
  var N = (document.all) ? 0 : 1;
  var width = 243


  var self_menu = new Array();
function write_menu()
{
  smc = 0; // count the position of the self_menu
  document.write("<div style='position:absolute'>");
  mn = 0;
  mni = 1;
  start = -1;
 
  for(i=0;i<Link.length;i++)
  {
   la = Link[i].split("|");

   if (la[0] == "0")
   {
    if(start == 0)
     {
      document.write("</div>");
      h =  csmc * iheight;
      tmn = mn;
      self_menu[smc] = new Array(tmn,h,0,-2);
      smc++;
      mn--;
     }
     csmc = 0;
    document.write("<div class='menu' style='top:"+mn+";height:"+height+"' id='down"+smc+"' onclick='prepare("+smc+","+mni+")'>&nbsp;"+ la[1] + "</div>");
    self_menu[smc] = new Array(mn,height,0,mni);
    smc++;
    mni++;
    mn+=height;
    start = 1;
   }
   else
   {
    if(start == 1)
     {
      if(N)mn+=2;
       document.write("<div class='item_panel' id='down"+smc+"' style='top:"+mn+"'>");
       start = 0;
     }
   
    document.write("<a href='"+la[2]+"'");
    if (la[3] != "") document.write(" target='" + la[3] + "' ");
    document.write("><div class='item' id='d"+i+"' style='height:"+iheight);
    if (N) document.write(";width:150");
    document.write("' onmouseover='color(this.id)' onmouseout='uncolor(this.id)'>&nbsp;&nbsp;"+ la[1] + "</div></a>");
    csmc++;
   }
  }
  if (start == 0)
   {
     document.write("</div>");
     h =  csmc * iheight;
     tmn = mn + 5;
     self_menu[smc] = new Array(tmn,h,0,-2);
     name = "down" + (self_menu.length-1);
     obj = document.getElementById(name);
     obj.style.borderBottomColor = "darkblue";
     obj.style.borderBottomWidth = 0;
     obj.style.borderBottomStyle = "solid";
   }
  document.write("</div>");
}
 

function color(obj)
{
 document.getElementById(obj).style.backgroundColor = over_bgc;
 document.getElementById(obj).style.color = over_tc
}

function uncolor(obj)
{
 document.getElementById(obj).style.backgroundColor = bgc;
 document.getElementById(obj).style.color = tc
}

var prevnr = -1;
var prevc = -1;
var vprepare = "stop";
var step = 0;
function prepare(nr,c)
{
 if (open_close)
 {
  if(prevnr == -1)
  {
   if(self_menu[nr+1][2] == 0)
   {
   prevnr = nr;
   prevc = c;
   }
   else
   {
   prevnr = -1;
   prevc = -1;
   }
   step = 0;
   pull_down(nr,c);
  }
  else
  {
  if((step == 0) && (prevnr != -1))
  {
    if (self_menu[nr+1][2] == 1)
    {
     step = 0;
     prevnr = -1;
     prevc = -1;
     pull_down(nr,c);
    }
    else
    {
    step = 1;
    pull_down(prevnr,prevc);
    prevnr = nr;
    prevc = c;
    }
  }
  else
  {
    step = 0;
    pull_down(prevnr,prevc);
  }
 }}
 else {pull_down(nr,c);vprepare = "stop"}
}

function end_prepare()
{
 if (step == 1) prepare();
 else {if (timerID != "") clearTimeout(timerID);}
}

function pull_down(nr,c)
{
 if (timerID == "")
 {
 to = self_menu[nr+1][1]
 begin = nr + 2;
 if (timerID != "") clearTimeout(timerID);
 if (self_menu[nr+1][2] == 0)
 {
  self_menu[nr+1][2] = 1;
  if(nr == self_menu.length-2) {to++;}
  epull_down(begin,to,0);
 }
 else
 {
  to = 0;
  self_menu[nr+1][2] = 0;
  name = "down"+(nr+2);
  open_item = 0;
  for(i=0;i<nr;i++)
  {
   if(self_menu[i][2] == 1)
    {open_item += self_menu[i][1];
    }
  }
  if (N == false) {open_item-= (c*1)};
  if (nr== self_menu.length-2) {val = self_menu[self_menu.length-1][1];to=-1;}
  else  val = parseInt(document.getElementById(name).style.top) -(open_item)-(c*height);
  epull_up(begin,to,val);
 }
 }
}

function epull_down(nr,to,nowv)
{
 if((nowv + steps) >= to) {vsteps = to - nowv;}
 else {vsteps = steps;}
 name = "down" + (nr-1);
 obj = document.getElementById(name).style.clip = "rect(0,"+width+","+(nowv+vsteps)+",0)";
 for (i=nr;i<self_menu.length;i++)
 {
  name = "down" + i;
  obj = document.getElementById(name);
  obj.style.top = parseInt(obj.style.top)+vsteps;
 }
 nowv+=vsteps;
 if(nowv < to) timerID = setTimeout("epull_down("+nr+","+to+","+nowv+")",speed);
 else {timerID = "";if(startid != "stop") open_all(); else end_prepare()}
}

function epull_up(nr,to,nowv)
{
 if((nowv-steps) <= to) {vsteps = nowv-to;nowv = 0;if(to == -1) vstep = nowv}
 else {vsteps = steps;}
 name = "down" + (nr-1);
 obj = document.getElementById(name).style.clip = "rect(0,"+width+","+nowv+",0)";
 for (i=nr;i<self_menu.length;i++)
 {
  name = "down" + i;
  obj = document.getElementById(name);
  obj.style.top = parseInt(obj.style.top)-vsteps;
 }
 nowv-=vsteps;
 if(nowv > to) timerID = setTimeout("epull_up("+nr+","+to+","+nowv+")",speed);
 else {timerID = "";end_prepare();}
}

var lb = new Array();

function startup(nr)
{
 write_menu();
 if(nr)
 {
 if(((nr.indexOf("|") != -1) || (nr.indexOf("all") != -1)) && (open_close == true)) alert("Error: the open_close property can only be used with a maximum of 1 default item.");
 if (nr == "all")
 {
 j = 0;
 for(i=0;i<self_menu.length;i++)
 {
  if(self_menu[i][3] != -2) {lb[j] = self_menu[i][3];j++;}
 }
 }
 else
 {
 lb = nr.split("|");
 }
 open_all();
 }
 else startid = "stop";
}
//free JavaScripts on http://www.ScriptBreaker.com
var startid = 0;
var open_part = 0;


function open_all()
{
 startid = lb[open_part];
 for(i=0;i<self_menu.length;i++)
 {
  if(self_menu[i][3] == startid)
  {
  open_part++;
  prevnr = i;
  prevc = startid;
  pull_down(i,startid);
  i==self_menu.length;
  }
 }
 if(open_part == lb.length) startid = "stop";
 
}

  View user's profile Private Nachricht senden
Falk Wussow

Dabei seit: 13.12.2005
Ort: Wiesbaden
Alter: -
Geschlecht: Männlich
Verfasst Fr 27.01.2006 10:53
Titel

Antworten mit Zitat Zum Seitenanfang

irgendwie finde ich nirgendwo einen <br>, der die nächste zeile einleitet. das find ich persönlich schonmal interessant.

vielleicht könnte man mal probieren, in jeder zeile aus

Code:
Link[1]  = "1|<img src='./grafiken/menu/home.gif' width='242' height='25' border='0'>|./home.html|mainFrame";


das zu machen:

Code:
Link[1]  = "1|<img src='./grafiken/menu/home.gif' width='242' height='25' border='0'><br />|./home.html|mainFrame";
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
caZpa
Account gelöscht


Ort: -

Verfasst Fr 27.01.2006 11:00
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
var iheight = 27; // height of the menu_items


die sind doch 25 hoch
 
kronk

Dabei seit: 10.02.2003
Ort: Legoland
Alter: -
Geschlecht: Männlich
Verfasst Fr 27.01.2006 11:49
Titel

Antworten mit Zitat Zum Seitenanfang

So viel Code für so ein Scheißmenü! * grmbl *
  View user's profile Private Nachricht senden
Sidschei

Dabei seit: 20.06.2003
Ort: Ponyhof
Alter: 108
Geschlecht: Männlich
Verfasst Fr 27.01.2006 12:11
Titel

Antworten mit Zitat Zum Seitenanfang

...die Ränder finde ich gar nicht mal so schlecht...

Wenn nur dieses dämliche Menue - welches ich zu den häßlichsten, die ich jemals gesehen habe zählen möchte - nicht wäre! * Ich muß mich mal kurz übergeben... *
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Denise_van_Hoorn
Threadersteller

Dabei seit: 24.01.2006
Ort: Berlin
Alter: -
Geschlecht: Weiblich
Verfasst Fr 03.02.2006 16:07
Titel

Antworten mit Zitat Zum Seitenanfang

@CAINAM & caZpa:

Eure Tips haben es leider nicht gebracht. <br> muß nicht eingefügt werden, dadurch daß ja eine Tabelle eröffnet wird, in welcher jeder Menüeintrag durch ein </td> abgeschlossen wird.
iheight gibt die Höhe der Zellen an. Setzt man sie auf 2 wird das Menü nur ein wenig geöffnet. Setze ich sie auf 25, zeigt Mozilla das Menü schön an, der IE allerdings behält die häßlichen Ränder, und zeigt "Impressum" nur noch halb.

@kronk & Sidschei:

Soviel zur unkonstruktiven Kritik. Und nun Eure Gegenvorschläge?

Denise
  View user's profile Private Nachricht senden
 
Ähnliche Themen Wie bekomme ich das Rechtsklickmenü weg?
Ich bekomme dieses Parse error: nicht weg
[alt-rahmen] weg damit! ...schon weg :)
Weisse Ränder in GoLive mit Layoutraster
Illustrator CS3: Weiße Ränder
[suche script etc.] mausempfindliche ränder
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.