Beiträge von synaptic

ul feste breite, margin:0 auto, list-style:none und clear:both
li float:left und bämm haste fertig die navi

das einfachste wäre eine ul zu nehmen und die LI floaten zu lassen gib dann der ul die breite, die sie benötigt, damit alle buttons nebeneinander passen und dann gibste der ul nen margin: 0 auto;

wenn du das ohne ul machen möchstest, empfehle ich dir die links floaten zu lassen, denen aber auch einen container drum herum zu verpassen, ist grundlegend das gleiche spiel wie bei der liste nur eben mit anderen elementen

also anmelden rules^^
da kommt nachher nich sowas wie hier zustande..^^

also der style ist der hier:

.menuArea ul li.selected a {
  border-top: 3px solid #09BB40;
  color: #000000;
}

und du musst natürlich auch das menü entsprechend der struktur von denen erstellen..:

<div class="menuArea clearDiv">
    <ul>
      <li class="selected"><a href="index.html">Home</a></li>
      <li><a href="tour.html">Tour</a></li>
      <li><a href="theme.html">Themes</a></li>
      <li><a href="pricing.html">Pricing</a></li>
      <li><a href="signup.html">Get Started<img src="images/getstarted-arrow.png"></a></li>
    </ul>
  </div>

wichtig ist, dass das listen-element dabei dann die klasse selected bekommt

versuche doch mal dem bild einen längeren namen zu geben
du müsstest dich bei den erstellern von adblock-kram erkundigen wie die ne ad erkennen.
ich hatte mal probleme mit adblock-plugins, weil ich eine artikel-detail-seite hatte wo ich die bilder mit ads_bildname.jpg gekennzeichnet hatte.
adblock hat die zeichenfoilge AD als abkürzung für advertisment erkannt und geblockt

hab deinen code jetzt mal gesichtet.
also zwei dinge dazu:
1.) dass du bei so einem murks den durchblick verlierst ist klar
2.) ich bin raus

also wenn codetrennung und funktion so dermaßen kopfkrebs erzeugt, will ich einfach nicht versuchen zu helfen. der code sieht aus wie 1989 von dreamweaver oder nem anderen kack wysiwyg-editor ausgereiert. keine anständige struktur da drin und die krönung sind dann onclick und styles als attribute

wenn du das aufräumst/räumen lässt, bin ich gerne bereit mir das nochmal anzusehen, aber das widerspricht jeder form von coding-anstand

das <form>-tag hat eine action und eine method.
action = die url an die die daten geschickt werden
method= art der übertragung

beides musst du bei dir entsprechend vorbereiten/kopieren und dann kannste dich mit deinem script auf dem anderen ding mit nem button einloggen

kein hexenwerk!

mal als beispiel:

https://accounts.google.com/ServiceLogin?h…/www.google.de/

der login dort hat folgenden code (vereinfacht):

<form method="post" action="https://accounts.google.com/ServiceLoginAuth" id="gaia_loginform" novalidate="">


<div class="email-div">
  <label for="Email"><strong class="email-label">E-Mail-Adresse</strong></label>
  <input type="email" value="" id="Email" name="Email" spellcheck="false">
</div>
<div class="passwd-div">
  <label for="Passwd"><strong class="passwd-label">Passwort</strong></label>
  <input type="password" id="Passwd" name="Passwd">
</div>
  <input type="submit" value="Anmelden" id="signIn" name="signIn" class="g-button g-button-submit">
  </form>

kopiere das fremde formular in deine seite, mach die url in der action zu einer absoluten url mit domain und allem tam tam und dann probier dich einzuloggen

jetzt ohne deine formulardinger gesehen zu haben, schieb doch schlichtweg die infos direkt an das entsprechende formular weiter.
musste doch nur action und method stimmen haben, die namen der felder und schiebst das dann ans echte script..

Hi Felix,

da wirst du bestimmt ein Problem bekommen, denn für Jobs ist das jobforum gedacht und da solltest du auch eine gegenleistung parat haben
viele user hier haben nicht die Zeit oder teilweise auch nicht die lust sich für umme in anderer leute angelegenheiten zu werfen.

das forum hier ist ein ort wo man hilfe zur selbsthilfe bekommt. wenn du dich also auf die reise zu deiner eigenen homepage begibst, wirst du zu konkreten problemen die frage stellen müssen und wirst dann diesbezüglich antworten bekommen.

aber als anfänger nen shop umzusetzen... gut nacht!
da ist so viel zu beachten, das is da nich einfach nur pillepalledesign umsetzen, da gehört ne menge mehr dazu.

an sich würd ich den gastl ja für seine direkt-freundliche art keinerlei beachtung schenken, aber hier hat er leider recht...

Viel Erfolg

Ok habs mir nun angesehen, was spricht beim netzwerken dagegen einen container für das flow-layout zu nehmen und die einzelnen füchse, wie auch ihre texte darin zu verorten?

der wrapper bekäme dann ein pos: relative, die füxxe und die texte zu jedem einzelnen absolut positioniert, das ein- und ausblenden is dann ja via jQuery kein act (dazu als tip: animate auf die opacity statt fadein und fadeout zu nutzen, es kann unschöne sprung-effekte geben, weil fadein und fadeout mit display:none arbeiten )

indexpage:
gleiches spiel:
box-ref-kl wird mit position: relative verzaubert und alles was dann da drin liegt kann eben via pos absolute entsprechend ein und ausblenden.
bzw gehts noch hübscher, wenn die info in einem hidden container liegt und man via mouseover einen eizelnen container an die maus klebt und dort werden bei mouseover nur die infos eingeblendet, die im hidden container sind.

alles in allem is des in wenigen std erledigt

kannst du das irgendwie codemäßig mal zeigen?
was spräche dagegen nur ein div zu nutzen und den inhalt schlichtweg zu tauschen? oder beide divs in einem wrapper zu halten und des eine auszublenden und das andere einzublenden? oder eben tatsächlich mit absoluter pos aber via javascript gelöst? es gibt viele wege, aber ohne design oder code zu sehen (am besten nen link oder so) is alles nur rein spekulativ

aber was mal total out is, ist wofür du dir die silberne schaufel im alte-threads-ausgraben verdient hast...
schau mal aufs datum!

statt der hr der ul oder dem umschliessenden div nen border-bottom geben.
alternativ gibt es auch in css die möglichkeit via width die breite der hr zu bestimmen.
den rahmen beim facebook-teil bekommste nur weg wenn du nicht die iframe-version nutzt, denke ich.
der iframe bettet ja eigene elemente ein. du kannst probieren den style zu kopieren, den border zu entfernen und !important anzufügen, um ein überschreiben zu erzeugen.

css4you.de wird dir einige fragen zu CSS erläutern können

ich zieh se mir erst reiun, wennse bei maxdome auftauchen, via beamer is echt entspannend filme zu gucken

also zumeinen gibt es für verschiedene browser die möglichkeiten verschiedene stylesheets einzubauen.
conditional comments für den IE
webkit-direktiven für webkits und der rest bekommt eben so nen eigenes stylesheet

ich bevorzuge aber eine kombination aus javascript und stylesheet (ja ich höre jetzt schon wieder viele brüllen: neeee lass das!)
praxisbezogen siehts so aus:
es gibt x hersteller von browsern und y versionen der browser
da sich die ganzen köddelbacken nich an anständige konventionen halten, kann man sich überlegen was man macht.
ich entwickle für teilweise 13 browser, dabei welche auf tablets etc.
ja der useragent ist nicht immer die waffe der wahl und auch rauslesen zu können was drinsteht ist nicht immer so einfach, weil sich viele ähneln.

aber: wenn du ein cooles javascript hast, was dir die browser erkennt und entsprechend klassen im body-tag setzt,
hast du zum einen einen coolen einsprungspunkt, um klassenbasierte vererbung im css zu erwirken und du kannst auch auf die einzelnen browser sogar bis in ihre versionen hin eingehen und für diejenigen, die das script blocken oder gar deaktiviert haben, nimmt man eben kleine designabweichungen hin

hoffe dir hilft mein ansatz weiter.

cheerios

und ps: crossposting is asi! http://www.html.de/css/47374-butt…ser-gleich.html

ich mein 2 tage warten is schon ne weile, aber dennoch hättest du dort deinen thread schliessen lassen können oder sonst zumindest hier darauf hinweisen sollen, dass du die frage woanders bereits ohne erfolg gepostet hattest!

Zitat von Unregistriert

Dieses Forum ist das perfekte Beispiel, das die vermeindliche Utopie schon heute Realität ist.
Es erfüllt weitestgehend die Richtlinien des W3C sowie die Vorgaben der Bundesregierung in Bezug auf Barrierefreiheit.

perfekt, weitestgehend

perfekt ist vollständig, also 100% und nicht weitestgehend. wobei das w3c nich im ansatz juckt. und ich glaube auch nicht, dass die bundesregierung so fortschrittlich ist, dass die vorgaben 100% der barrieren decken würden/werden.
ich denke ich bin da auch einfach zu strikt in der bedeutung des wortes "frei" mir wurd letztens auch nen sauteurer, grätenFREIER fisch verkauft, den ich an meine 5 tiger verfüttern wollte und dennoch hab ich beim aufteilen gräten gefunden. hat mich auch abgefuckt, weil ich ja nich grätenfrei bestelle und bezahle, aber dennoch nicht bekomme.
jedoch ist auch mit diesem posting dem TE nicht geholfen...

barriereFREI ist eine utopie, das gibt es schlichtweg nicht.
barrierearm schon eher und css ist nich barriereärmer als js.
es liegt einzig daran, wie man die entsprechenden informationen aufbereitet und anbietet.

ich seh da nur 2 wege, das boxmodell hat doch in erster linie nichts mit der positionierung zu tun.

also sauber ist es schon nicht, wenn du eine ID mehrfach vergibst

ja is doch auch klar, du springst mit dem anker zur ersten ID, die du im anker benannt hast, du wirst es wahrscheinlich nicht hinbekommen den header zu zeigen UND die funktion des menüs zu bekommen.
ok ein test wäre einfach nen anker zu nehmen dem auch die Id "one" zu geben und das ganze direkt am header zu platzieren.
aaaber: eine ID hat man eigentlich nur ein einziges mal zu vergeben, sonst nimmt man ja auch für nen anker das name-attribut.
schau dazu mal bei selfhtml.

und rein css ist löblich, doch heutzutage ist javascript nicht mehr das verhasste geschissel womit man böse sachen macht wir leben im zeitalter von ajax und dann kannste auch js nehmen, um dein menü mit nem display block zu versehen

sorry stift, dass ich momentan so wenig zeit habe...
hab dir mal was vorbereitet, es ist nicht das ganze script, die hauptfunktion fürs dropping musste noch machen.
aber ich hab dir mal im jquery-style dein menü soweit mal vorbereitet.

eventuell hilft es dir ja mal nen anstoss zu finden

wollte dich jetzt nicht warten lassen, bis ich es fertig habe, sondern dir schomma nen zwischenstand bieten.
wenn du fragen hast nur raus damit

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>Ninja at his best :o)</title>
  <script type='text/javascript' src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
  <script type='text/javascript'>
function createMenue() {


    var screenWidth = $(window).width()-440;
    var screenHeight = $(window).innerHeight();
    var docHeight = (screenHeight/2)-30;


    $('body').append('<div id="dropdown"></div>');
    var myMenu = $('body').children('#dropdown'); //ginge an der Stelle auch anders, aber ich habs mal so gemacht, damit du den werdegang nachvollziehen kannst
    var menuItems = new Array();
    menuItems.push('Home');
    menuItems.push('Übersicht');
    menuItems.push('Spiele');
    menuItems.push('Informationen');
    menuItems.push('Login');


    myMenu.css({
        width             : screenWidth + "px",
        height             : "30px",
        'margin-left'    : "220px",
        'margin-top'    : docHeight + "px",
        position        : 'relative'
    });


    for(index in menuItems){
        $('<div id="MI'+index+'" class="js_menuItem">'+menuItems[index]+'</div>').appendTo(myMenu);
        //wir registrieren an den neuen objkten hier noch keine weitere funktionalität, das gab bei mir bisher immer konflikte oder die funktion war nicht vorhanden
    }      
//    menuItems wird hier jetzt überschrieben, um ressourcen zu sparen
    var menuItems = myMenu.find('.js_menuItem');
    menuItems.each(function(){
        var aktitem = $(this);
        aktitem.mouseover(function(e){
            e.preventDefault();
            e.stopPropagation();
            var item = $(this);
            item.css('background', '#efefef');
        });
        aktitem.mouseout(function(e){
            e.preventDefault();
            e.stopPropagation();
            var item = $(this);
            item.css('background', '#000000');
        });
    });
}
$(document).ready(function(){
    createMenue();
});
  </script>
  <style type='text/css'>
html, body {
    background-color: #000;
    color: #fff;
    font: 12px arial;
}
div.menue_item
{
border: 1px solid #fff;
}


  </style>
</head>
<body>



5 Elemente (MI1 bis MI5) im MainContainer "menue" welche per JavaScript (createMenue()) erstellt werden.<br />
Diese 5 Elemente besitzen ein mouseover- und mouseoutEvent.<br />
Beim mouseOverEvent soll sich das Element nach oben ziehen und nach unten ausklappen (funktioniert soweit!)<br />
Wenn ich nun aber andere Objekte in den Elementen MI1 bis MI5 habe, erhalten diese die gleiche Eventfunktion vom Parent.<br />
Sprich wenn man den Button für ein Menüpunkt hovert, wird dropup() ausgeführt, da das ParentElement ein mouseout-Event unterfällt.<br />
Anschließend wird lustiger Weise dropdown() erneut ausgeführt und das ganze klappt sich wieder aus. Selbst wenn ich meinen Buttons beim mouseoverEvent null zuweise oder eine leere function.<br /><br />
</body>




</html>