Beiträge von Lemke

    Einfacher find ichs wenn alles an seinem Platz ist. Body bei Body in Line, Divs Namens Xyz bei Div als Style, mehrere Links namens Abcdefg als <script>.Abcdefg{...}</script>. Also alles dort wo die entsprechende Funktion zuerst auftritt. Wer das auch immer erfunden hat Dinge zu verteilen auf verschiedene Dokumente -! Warum auch immer, muss da nicht mitmachen nur weils andere machen. Aber finds praktischer alles in 1. Sonst kopierst du 1 Dokument und willst anfangen zu arbeiten und merkst es gibt weiteres Material in ausgelagerter CssDatei und wenn du pech hast und mehrere funktionale Elemente editierst sinds dafür noch mehr.

    Genau das suchen müssen hasse ich an WordPress,
    und hab mich entschieden die Seite komplett neu zu bauen.


    //Stell dir vor, du musst diese Webseite irgendwann warten, bzw. das Design verändern. Was ist da wohl komfortabler und einfacher?

    Hi Stef. Danke. Das hab ich zusammenbauen können in 1 HtmlDatei, habe SlideIntro umbenannt in FotoShow,
    mit Ergänzung einer ZusatzZeile vorne/ oben im Header konnte ich die Bilder zoomen auf komplette Höhe.

    Ist tatsächlich mittig. Ich finds viel versprechend dass die zu ladenden Dokumente im Html in einer Liste untereinander sind, statt im Script verbaut.


    Man kann das so modulieren dass es auch HtmlSeiten lädt statt nur Bilder, also zB. Bilder mit (vom Browser automatisch übersetzbaren) Texten,
    mit <iFrame class="FotoShow" src="Service.html"></iFrame>.

    Ist praktisch um Folien bestehend aus Html, mit Bildern und Text, in Browser zu laden, der automatisches Übersetzen kann.


    Aber Fehler tritt auf_

    - Bilder wechseln nicht mehr von allein.


    Frage, Wie kann ich dein Script kombinieren mit einem weiteren Script wo die automatische BidlerShow funktioniert (aber Bilder leider nicht mittig sind)? Jetzt mal mein aus deinen Zeilen kombiniertes Script +darunter andere Version wo Bilder Bildschirm richtig bedecken und FotoShow funktioniert aber Bilder nicht mittig sind, sondern links bündig.


    Dein (in 1 Dokument zusammengesetztes) Ergebnis_



    Und hier mein Dokument wo alles klappt außer mittige Bilder_


    Vielleicht findet jemand 1e Lösung, Bilder kompletter Bildschirm +mittig +automatische Show +auf 1 Klick sofort weiter?

    Arbeite daran seit 3 Wochen.

    Danke.

    Wie kann ich meine Seite so modifizieren, dass oben im Browser in AdressLeiste kein "nicht sicher" (Fehler?) mehr zu sehen ist?

    Hat das was zu tun mit Http/ HttpS ?


    Wie kann ich dafür die entsprechende Funktion einbauen?


    Bzw. Zertifikate integrieren? Sind Zertifikate etwas anderes zusätzliches als Http/ HttpS oder hängt das miteinander zusammen?


    Braucht man das überhaupt, um die Seite zu laden? Ich selbst weis ja dass meine Seite sicher ist, aber will natürlich dass viele Leute die WebSeite reinen Gewissens besuchen können.


    Ich zeig mal was ich meine, hier der BildschirmAusschnitt

    Zertifikate.png

    InternetExplorer meckert rum wegen angeblich blockierten Inhalten, selbst bei soetwas einfachen wie Logo das sein Bild ändert beim hovern mit MausZeiger.

    und für SlideShow. Ich selbst nutze den InternetExplorer am häufigsten, der ist Standard mit Windows/ bei älteren Windows erst recht.

    Gute WebSeiten sind abwärts kompatibel, zB. aktuelle WordPressSeite.

    Soll also im iExplorer gut aussehen!


    Was kann ich tun?


    Betreffender Code

    Code
    1. <a href="index.html" title="start" alt="Start" onmouseover="Logo.src='Logo1.png';" onmouseout="Logo.src='Logo.png';">
    2. <img id="Logo" src="Logo.png" border="0" width="300px">
    3. </a>

    Wie kriegt man das StartMenu über/ auf die SlideShow, unten an Rand? Befindet sich neben Logo oben bündig, sollte aber
    besser mit dem Logo unten bündig sein,
    bzw. mittig daneben.


    HtmlQuellCode


    Zeichnung

    Anordnung.png

    StartLeiste mit dem Logo und den Links im Menu soll außerdem beim Herunterblättern Farbe ändern von durchsichtig,

    in dunkelblau undurchsichtig. (Menu kann beim Scrollen oben anheften, erledigt.) Fehlt FarbÄnderung.

    Vielen Dank.

    Hi Basti1012, danke. Die Farbe ändert sich genauso wie das sein soll.

    Konnte das Script rüber kopieren, ändert die Farbe dadurch genauso,

    aber hält mit meinem Html nicht mehr oben, sondern bewegt sich über den Rand hinaus, bei mir.

    Dann hab ich gesehen du hast dem Menu anscheinend 10% Höhe zugewiesen, dem iFrame 90%. Kann das sein? Gute Idee. Das ist eine Frage, wie kann man das Menu anpassen, dass es über der BegrüßungsSlideShow gezeigt wird, statt darunter?


    Hab auch weiter gemacht mit dem Dokument. Elemente neu benannt, Content ist Information, StartMenu sind jetzt StartLinks und Header ist StartMenu.

    Da hat sich Problem aufgetan, dass ScrollBalken in den iFrames erscheinen. Die iFrames nehmen nicht komplette Höhe ein von den verlinkten Seiten, sondern nur 100% vom Monitor. Man sollte mit kompletter Seite alles zusammen scrollen können. Weil 2 oder mehr ScrollBalken nebeneinander sehen nicht gut aus. Wie kann man das?



    Dann außerdem meckert der InternetExplorer rum, es gäbe ein paar blockierte Elemente. Warum? Was soll das heißen? Sowas macht auf Besucher sicher schlechten Eindruck.

    Wie kann man es so ändern dass auch mit InternetExplorer alles sofort ohne Problem klappt?

    Ist aber noch Katastrophe!

    Das Sticky ist schon drin.

    Menu ist teils durchsichtig background-color:rgba(135, 176, 218, 0.96);
    aber ändert nicht Farbe in undurchsichtig beim scrollen. Dafür fehlt mir jeder Ansatz.


    In dem Menu werden die Links neben Logo angeordnet aber oben, und nicht unten an Linie ausgerichtet, das Problem ist auch bei anderer Seite an der ich (parallel) baue.


    Der iFrame ist nicht in dem Menu als Hintergrund, sondern wird verschoben nach hinten als SeitenHintergrund.


    Das einzige was (fast) klappt ist Logo kann mit hovern Bild ändern_

    Code
    1. <a href="index.html" title="start" alt="Start" onmouseover="Logo.src='Logo1.gif';" onmouseout="Logo.src='Logo.gif';">
    2. <img id="Logo" src="Logo.gif" border="0" width="300px">
    3. </a>

    aber leider kann ich nicht statt "width=300px" Höhe eingeben height="64px".

    Max-Width... sowas wird garnicht angewandt vom Browser.



    Mehrere iFrame Elemente werden hintereinander angeordnet, anstatt nacheinander.

    Für Seite baue ich an Rahmen (funktioniert aber noch nicht komplett, muss am einfachsten neu). Bestehend aus


    1) Menu mit Logo +Links

    2) SlideShow = SeitenHintergrund von externer Quelle via. iFrame.

    3) darunter Text, mehrere externe InhaltElemente untereinander zB. Text, externe Seiten mit iFrame.


    Herausforderung = Start Menu ist anfangs halbdurchsichtig, soll unterhalb von der SliderShow angeordnet sein, also unterer BildschirmRand.

    ---> Wenn man scrollt, soll es dunkelblau + undurchsichtig werden,
    ----> es soll oben im BildschirmRand zu finden bleiben.


    LösungsAnsatz

    Konzept.png


    Bisheriger BearbeitungsStatus von mir = ordnet das Logo + StartMenu generell mit festem Abstand nach oben an, ist immer gleich farbig, das iFrameElement ist nicht untereinander, der Reihe nach, sondern in Schichten hintereinander/ übereinander. Mein ZwischenErgebnis teil ich lieber nicht

    weil dann über Details rumgemeckert wird die nichts mit erzielter Funktion zu tun haben, obwohl zuerst das allgemeine GrundGerüst passend gemacht werden soll! Also am besten komplett neu.



    Wer hat eine Idee?

    Hi. "das halbe Bild außerhalb des Sichtbaren Bereichs" wär ja akzeptabel.


    Bilder sind so gewählt dass diese allgemein passen (hohe Auflösung, gutes Motiv, HauptInformation mittig)
    aber in jeweiliges Element automatisch genau bündig eingepasst werden sollen!

    - ZOOMEN auf jeweils größeren Abstand, entweder horizontal oder vertikalen Abstand,

    - keine Streifen, weder seitlich noch oben/ unten,

    - OHNE VERZERRUNG originalen BildMaßstab beibehalten.

    - MITTIG ausgerichtet (nehme man an, in Mitte von Kamera befindet sich das anfokussierte Objekt mit HauptInformation),

    - was übersteht wird weggeschnitten. ZB. Angenommen Bild ist 21:9 dann wirds bei 16:9 Monitor auf 16:9 geschnitten.


    Element soll sein worein ichs einfüge, zB. Box oder in <div> als BildschirmHintergrundBild.

    Hi Basti1012. SlideShow auf Seite füllt nicht ganzen Bildschirm, links und rechts sind weiße Ränder,
    und Bilder sind vertikal nicht mittig, sondern werden oben angeordnet.


    pasted-from-clipboard.png



    Außerdem (woher das auchimmer kommt) werden bei dem im Head verankerten Styles
    WERBUNG

    diverser auf ersten Blick anscheinend nicht seriösen Seiten
    eingeblendet, jenes Phämomen existiert auch bei manchen anderen Seiten,
    die im Head Css eingebunden haben,
    immer im Zusammenhang mit OperaBrowser.

    fuck.png

    Kommt schon, Bilder +gestreckt +ohne Verzerrung +jetzt noch bitte MITTIG.

    Wie klappt das?

    Danke!


    LösungsAnsätze_

    .img {object-fit: cover;background-size: cover;display: block; margin-left: auto; margin-right: auto;}

    oder

    .img {object-fit: cover;background-size: cover;display: block; margin:0 auto;}



    Hier der SlideShowKasten

    Wie kann man in dem BilderShowScript die BILDER MITTIG ANORDNEN? Dein Beispiel funktioniert nur mit einzelnem TestBild.

    Wenn ich das einbaue bei Bildern, wird es vom Browser wieder nicht umgesetzt, sondern Bilder rechts angeordnet, statt in Mitte zentral gesetzt.

    So sieht mein Css dafür aus

    <style> .img {object-fit: cover; background-size: cover; display: block; margin:0 auto;} </style>

    .


    Muss man das bei der SlideBox ändern? (Getestet. Funktioniert auch nicht).

    <style> .SlideBox {height:100%; width:100%; vertical-align: middle; background-color:rgba(16,32,128,0.1); background-repeat:no-repeat;} </style>



    Dein margin left und right auto kann man auch so schreiben

    margin:0 auto


    Dein Code könnte auch so aussehen

    kommt bei mir das gleiche raus

    Hi Basti1012. Warum IN LINE STYLES bevorzugt? Meine WebSeiten sind einzelne funktionale ElementPakete (ich will nicht das Wort Äpp verwenden so kompliziert auch nun wieder nicht) -welche ich modifiziere und in verschiedenen WebSeiten einbaue zB. MusikSpieler mit drehendem PlattenSpieler und PlattenAuswahl daneben alles in WabenForm wo Kacheln jeweils an richtigem Ort platziert sind/ bleiben sollen, oder Windows10Desktop nachgebaut worin Programme als DownloadLink zum original SoftwareAnbieter verlinkt sind (spart die Werbung von Installer von PcMagazinen),
    oder aktuelles Projekt NewsBriefingShow mit Bildern +wenig Text, zum schnell weiter klicken.

    Aus dem Grund ist es für meinen Bedarf erforderlich, wenn alles für sich komplett ist und kompakt zusammengepackt in 1 Dokument, alles soll direkt auf 1rsten Blick auffindbar sein! Wenn ich Styles in Head knalle/ obere DokumentHälfte, und unterer Hälfte/ Body Elemente extra rein sortier, muss man ständig hin und her blättern um etwas zu ändern. Wenn ich das Jahre später öffne und will nur 1 Element rüber kopieren fehlte das Css.
    Falls Elemente zu lang werden dafür arbeite ich mit BrowserFunktion zum Element untersuchen, da kann man die Elemente zusammen oder aus -klappen.

    Was man heute (nicht mehr) macht interessiert mich nicht (außer wenns die Browser nicht unterstützen).

    Baue das was man morgen klickt!



    // Willst du bei einer Homepage von mehreren 100 Seiten das alles in den html schreiben ?

    Danke basti1012, das funktioniert. Tolles Script!


    Trick war über Body noch im Header die

    <style>* {margin:0px; padding:0px;height: 100%;top:0px;left:0px;right:0px;bottom:0px; } </style>

    rein zu setzen. Wenn man die Definition in BodyStyle übernimmt gehts nicht.


    Jetzt noch 1 Kleinigkeit, wie kann ich Bilder horizontal mittig setzen? Da habe ich was gefunden mit Margin left right als BlockElement, aber wendet der Browser nicht an.


    Teil dein Vorschlag! Hier. Alles fertig. Dann kann ich dein CssVorschlag testen, klappt oder nicht. So einfach, wenns gut ist kann ich mir überlegen was ich davon nutzen will.


    Aber halt mir keine Vorträge über SinnFragen des Lebens. Css KANN! man so einbauen wie folgt, das ist bewährt und klappt ansonsten mit anderen Funktionen in allen von mir genutzten Browsern tadellos. Ich will nur dass die Bilder sollen auf VollBildschirm zoomen, was noch nicht funktioniert hatte, es wird entweder verzerrt oder die Bilder haben Streifen an Fenstern daneben oder darunter.


    Code
    1. <img style="
    2. object-fit: cover;
    3. background-size: cover;
    4. "
    5. src="TestBild.jpg">