Verwandte Themen

dieTrolle
05.07.2024, 11:15
Dropdown auf iMac funktioniert nicht, wasmuss ich ändern?

Ich habe ein Dropdown-Menü erstellt, welches auch auf allen von mir getesteten Browsern funktioniert ( Firefox, Chrome, Edge, Opera, Vivaldi, Tor). Nun bekam ich die Rückmeldung: Funzt NICHT auf Safari. Habe mir die URALT Version von Safari für Windows heruntergeladen; Das Ergebnis ist katastrophal null Reaktion auf Auswahl!

Habe den Quelltext aus dem Internet und nur meinen Bedürfnissen angepasst.

css

#menu,#menu ul{list-style:none;padding:0;}
#menu li{margin:5px 10px;}
#menu a{text-decoration:none;outline:none;display:block;color:#777;padding:5px 14px}
#menu a:hover,#menu a:focus{color:black; background:orange;}
#menu .hider{overflow:hidden}
#menu .sub ul{margin-top:-200%;transition:.5s;-webkit-transition:.5s}
#menu .sub a:focus ~ .hider > ul,#menu ul:hover{margin-top:0;}

ul {
   max-width: 12em;
}

ul ul {
   max-width: 12em;
   border: 2px solid orange;
}

ul ul ul{
   max-width: 12em;
   border: 2px solid green;
}
//ul ul ul:hover {background-color:white;}

ul ul li {
   background-color: Gainsboro;
   margin: 2px;
   z-index:1;
}

php

<ul id="menu">
   <li class="sub"><a href="#">Select Order by</a>
      <div class="hider">
         <ul>
            <li><a href="image_1.php";>Listing</a></li>
            <li><a href="image_self.php";>Own Selection</a></li>
            <li class="sub"><a href="#">Inventory No.</a>
               <div class="hider">
                  <ul>
                     <li><a href="image_2.php";>Numerical</a></li>
                     <li><a href="image_from.php">from - to</a></li>                           
                  </ul>
               </div>
            </li>
            <li class="sub"><a href="#">Title</a>
               <div class="hider">
                  <ul>
                     <li><a href="image_2.php?order=Title">Alphabetical</a></li>
                     <li><a href="title_from.php">Letter Selection</a></li>                           
                  </ul>
               </div>
            </li>
            <li class="sub"><a href="#">Art Typ</a>
               <div class="hider">
                  <ul>
                     <li><a href="image_2.php?order=ArtTyp">Alphabetical</a></li>
                     <li><a href="art_from.php">Selected</a></li>                           
                  </ul>
               </div>
            </li>
            <li class="sub"><a href="#">Art Series</a>
               <div class="hider">
                  <ul>
                     <li><a href="image_2.php?order=Category">Alphabetical</a></li>
                     <li><a href="cat_from.php">Selected<br>Search in all Entries</a></li>
                     <li><a href="series_from.php">  Selected<br>Search in Art Series Menu<a><li>                           
                  </ul>
               </div>
            </li>
            <li class="sub"><a href="#">Media</a>
               <div class="hider">
                  <ul>
                     <li><a href="image_2.php?order=Medium">Alphabetical</a></li>
                     <li><a href="media_from.php">Selected</a></li>                           
                  </ul>
               </div>
            </li>
            <li class="sub"><a href="#">Dimension</a>
               <div class="hider">
                  <ul>
                     <li><a href="dim_from.php?dim=height">height<br>from - to</a></li>
                     <li><a href="dim_from.php?dim=width">width<br>from - to</a></li>                           
                 </ul>
               </div>
            </li>
            <li class="sub"><a href="#">Exhibition</a>
               <div class="hider">
                  <ul>
                     <li><a href="exhibition.php?Time=now">Currently on Display</a></li>
                     <li><a href="exhibition.php?Time=all">All Artworks<br>Order by Exhibitors</a></li>
                     <li><a href="aussteller.php">Selected<br>by Exhibitor</a></li>                           
                  </ul>
               </div>
            </li>
         </ul>
      </div>
   </li>
   <li class="sub"><a href="#">Image Info</a>
      <div class="hider">
         <ul>
            <li><a href="image_info.php">all</a></li>
            <li><a href="image_infrom.php">from - to</a></li>                  
         </ul>
      </div>
   </li>
</ul>

Was muss ich wie ändern oder ergänzen damit es auch auf dem iMac / Safari läuft? Wie oben gesagt alle anderen Browser einwandfrei!

HTML, Webseite, CSS
1 Antwort
Zortah123
04.07.2024, 13:45
Problem mit PHP-Composer: Was ist schief gelaufen?

Versuche hier grade auf meinem Server 2 verschiedene Librarys mithilfe von Composer zu installieren.

Leider ist wohl irgendwas bei der Installation von Composer gehörig schief gelaufen: Ich konnte zwar zunächst eine Library erfolgreich installieren aber es fing damit an, dass ich alle Composerdateien im /root Verzeichnis hatte. Diese wollte ich dann via Terminal nach /var/www/html verschieben (dabei muss aus irgendwelchen Gründen eine dazugehörige autoload.php verloren gegangen sein) also den kompletten Composerordner gelöscht und alles versucht neu zu installieren und aus der noch vorhandenen composer.phar versucht die Dateien neu zu extrahieren und dabei laut Terminal sogar auf die neueste Composer Version upgegradet: Dies hat zum Teil geklappt, nur eine extrem wichtige "composer.json" wurde dabei nicht erstellt. Also zunächst mal mit mehreren verschiedenen Anleitungen versucht diese manuell zu erstellen (was ja anscheinend in 5 Minuten problemlos möglich ist).

Naja das Problem ist nun, dass ich irgendwo festsitze. Ich habe die Anleitungen im Netz befolgt, aber bisher hab ich weder genau kapiert wieso diese extrem wichtige Datei nach erneuter Installation fehlt, noch was genau in diese Datei reingeschrieben werden muss oder per Script reingeschrieben wird (Name des Projekts? die Pfade (Namespaces?) der Packages, die ich installieren möchte?), noch wie ich folgenden Fehler beheben kann:

In ArrayLoader.php line 44:

Unknown package has no name defined ([]).

Diesen Fehler bekomme ich nun seit Stunden, egal was ich mit Composer versuche, auch wenn ich einfach versuche zu debuggen oder eine erneute Installation probiere...

Irgendwelche Ideen oder Ahnungen was hier falsch gelaufen ist?

Internet, Linux, IT, Webseite, programmieren, PHP, Putty, Script, ssh, Terminal, Composer, Kommandozeile, Debian 10
2 Antworten
melisax795
03.07.2024, 11:19
Mit Bildern
Wieso wird diese Webseite in React ohne Header und Footer gerendert?

Zur Aufgabe: Man soll drei Komponenten haben: Header, Main und Footer. Diese drei Komponenten müssen dann in die MainView und die MainView in die App.

Wenn ich die Webseite lade, ist zwar alles gut soweit, aber wenn ich über die Navigation auf Kontaktseite z.B. klicke, werden weder Footer noch Header angezeigt. Kann mir jemand bitte helfen?

import React from 'react';
import { Link } from 'react-router-dom';
import '../App.css';

const Header = () => (
  <header>
    <div id="logo">
      <Link to="/startseite">
        <img src="/img/Chicolio_Logo_trs_thumbnail.png" alt="Logo" />
      </Link>
    </div>
    <h1>Startseite</h1>
    <nav>
      <Link id="homepage" to="/startseite">Startseite</Link>
      <span>|</span> {/* Vertikaler Strich als visuelle Trennung */}
      <Link id="contactpage" to="/kontakt">Kontakt</Link>
      <span>|</span>
      <Link id="impressum" to="/impressum">Impressum</Link>
      <Link id="shoppingcart" to="/warenkorb">Warenkorb</Link>
    </nav>
  </header>
);

export default Header;

import React from 'react';
import '../App.css';

const Footer = () => (
  <footer className= "footer">
    <div>
      <p>&copy; Unsere Namen - 2024</p>
    </div>
  </footer>
);

export default Footer;

import React from 'react';
import Startseite from './Startseite';

const Main = () => {
  return (
    <div>
      <Startseite />
    </div>
  );
};

export default Main;

import React from 'react';
import Header from './Components/Header';
import Footer from './Components/Footer';
import Main from './Components/Main';
import './App.css';

const MainView = () => {
  return (
    <div>
      <Header />
      <Main />
      <Footer />
    </div>
  );
};

export default MainView;

import React from 'react';
import { BrowserRouter as Router, Route, Routes, Link } from 'react-router-dom';
import MainView from './MainView';
import Warenkorb from './Components/Warenkorb';
import Impressum from './Components/Impressum';
import Produkt from './Components/Produkt';
import Startseite from './Components/Startseite';
import Kontakt from './Components/Kontakt';
import './App.css';

// Wurzel-Appkomponente
function App() {
  return (
    <Router>
      <Routes>
        <Route path="/" element={<MainView />} />
        <Route path="/warenkorb" element={<Warenkorb />} />
        <Route path="/impressum" element={<Impressum />} />
        <Route path="/produkt/:id" element={<Produkt />} />
        <Route path="/startseite" element={<Startseite />} />
        <Route path="/kontakt" element={<Kontakt />} />
      </Routes>
    </Router>
  );
}

export default App;

Das ist, wenn man nach dem Browsen in der Navigation auf Startseite klickt.

Und das wird direkt beim Öffnen angezeigt:

Bild zum Beitrag
HTML, Webseite, JavaScript, Webentwicklung, React, node.js
1 Antwort
Moni98799
26.06.2024, 03:10
Mit Links
FEHLERSUCHE bei einem nicht mitscrollenden "Nach-Oben" Button?

Mehrere Stunden hat es mich heute schon beschäftigt, ich komme und komme nicht darauf...

Es geht mir um den seitlichen (rechts) "skip-to-top" Button. Exakt alles habe ich genauso wie in diesem Pen Beispiel ( Link: https://codepen.io/jackherizsmith/pen/oNxVWrK ) gemacht.

Aber bei mir scrollt der Nach-Oben Button nicht mit wie in dem Pen Beispiel :

Meine Demo-Seite: http://misanthrop.bplaced.net/test/open-public/Testseite-V11b1__26-06-24.html (aktualisiert)

Allerdings habe ich mein position: relative nicht main mitgegeben sondern der id "skiptop". Mein Dev-Tool zeigt mir an, das jeweils relative und absolute richtig erkannt wird und es wird mir auch so gezeigt.

Nur halt die Klasse "scroll-top_link" scrollt nicht in dem Bereich hoch und runter wie es soll.

Was mache ich da falsch. Könnt ihr mir bei der Fehlersuche helfen?

Vieles habe ich ausprobiert, auch meinem main habe ich position relative gegeben, aber auch anderen Elementen setzte ich position relative allerdings ohne Effekt.

Das Ding ist allerdings das dieser seitliche Bereich ein eigenes grit-Element ist. Sprich:

.main-content-wrapper {
    display: grid;
    grid:     "main-head main-head" auto
            "navigations navigations" auto
            "main-content main-content" 1fr
            "main-footer main-footer" auto
          / minmax(0, auto) [main-nav-start] 5em [main-nav-end];
    }


#navigations {
    grid-area: navigations;    
    grid-column-end: main-nav;
}

#main-nav {
    grid-area: navigations / main-nav;
    position: relative;
    outline: thin solid red;
    margin: 0;
    padding: 0;
    z-index: 100;
}

Wo ich letztendlich das Hauptmenü anzeigen lasse, da habe ich noch keinen richtigen Plan.

Eventuell in der Zeile: #navigations und dann seitlich rechts.

Nicht zu verwechseln mit Seiten-Inhalt, das ist ein Seiten internes Sprungmenü zu einem bestimmten nach Datum geordneten Artikel. Bisher habe ich noch keine bessere Bezeichnung dafür gefunden. Irgendeine Idee dafür?

Zurück zum Hauptmenü, oder ich packe das Hauptmenü seitlich zum Nach-Oben Button, mache es ebenfalls sticky.

Was dann allerdings bei einem schmalen Browserfenster passiert?... Da habe ich eigentlich vor das Hauptmenü (oberhalb vom "Seiten-inhalt" Link) ohne Button (offen) untereinander anzuzeigen.

Sag mal bitte, da mir die Praxis fehlt, wie würdest Du es lösen?

Zurück zur eigentlichen Frage:

WICHTIG ist mir nun, warum der SCROLL-TOP Button nicht nach oben und unten mitscrollt wie er es eigentlich sollte.

Muss ich da was an der html-Struktur ändern. Ein zusätzliches div?

Ich habe da heute lange daran gesessen...

HTML, Webseite, CSS, JavaScript, HTML5, Code, Webdesign, Webentwicklung, Visual Studio Code
3 Antworten
Evocati89
22.06.2024, 17:30
Ziel: Eigenes Videomaterial über Webseite dauerhaft Streamen wie Live TV (z.B. WOW Live TV), wie gehe ich vor?

Hallo in die Runde,

ich möchte meine Serien und Filme über meine Webseite streamen. Aber nicht durch anklicken eines einzelnen videos. Sondern ich will eine Sammlung von Filmen und Serien zusammen stellen. Und die in Schleife auf der Webseite laufen lassen. Kein vor oder zurück spulen.
Wie beim Fernsehen halt. Rechtliche Fragen stellen sich nicht, da keine Urheberrechtsverletzungen begangen wurden und der Stream nur für mich ist.
Da ich aber Oft nicht weis, was will ich schauen. Hätte ich gerne wie beim Fernsehen. Das ich meine Webseite Aufrufe. Und dort einfach ein Programm läuft.

Mein Problem: Ich weis nicht, wie ich rangehen soll. Welche Software ich brauche.

Ich bin vollkommen ratlos. Eine Wordpress Webseite Aufzusetzen ist kein Problem. IT Kenntnisse sind vorhanden. Dieses Spezielle Problem hab leider wohl nur ich.

Hat jemand eine Idee oder Gedanken Ansatz wie ich das Bewerkstellige?

Am Liebsten würde ich alle dateien einfach in einen Ordner Packen. Und im Zufallsprinzip laufen die Videos einfach durch. Und wenn ich meine Webseite aufrufe. Dann kann es Serie X in Folge y bei Minute 23 und 45 Sekunden sein und dann will ich das der Stream für mich da gerade auch einfach weiterläuft.

Viel Text. Vielleicht auch missverständlich. Erstmal danke an jeden, der sich die Frage überhaupt durchliest.

Ich hoffe jemand kann helfen.
Liebe Grüße
Evocati89

Internet, Film, Webseite, Streaming
1 Antwort
Mia1307
22.06.2024, 16:42
Mit Links
Wie bei html bei bild so copyright machen?

Also ich will dass bei jedem Bild so copyright an der Seite ist und habe so ein Code gemacht aber alle copyright sachen werden an einer Stelle angezeigt und nicht bei den Bildern.

       <figure>
            <img class="cover" src="https://cdnb.artstation.com/p/assets/images/images/019/622/599/large/-3.jpg?1564323970"style="object-position: 50% 100%;">
            <figcaption class="copyright right"style="color: rgb(83, 58, 3);">
               Image by Denis Nigmatullin on artstation
            </figcaption>  
           <img style="position: absolute; left: 70%; top: 27%; width: 250px;" src="https://i.pinimg.com/originals/ca/83/ed/ca83ed22042d9846d568682d956d09bf.jpg">
           <figcaption class="copyright right"style="color: rgb(83, 58, 3);">
               Image by altantrengsingf on artstation
           </figcaption>
           <img style="position: absolute; right:91%;  top: 0%; width: 100px;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/ba/Akhilleus_Patroklos_Antikensammlung_Berlin_F2278.jpg/910px-Akhilleus_Patroklos_Antikensammlung_Berlin_F2278.jpg"> 
           <figcaption class="copyright right"style="color: rgb(83, 58, 3);position: absolute; right:91%;  top: 0%;">
               Image by Bibi Saint-Pol on wikimedia
           </figcaption>  
            <img style="position: absolute; right: 91%;  top: 18%; width: 100px;" src="https://64.media.tumblr.com/55d89b8a87818f817ec8851154739637/tumblr_npwai2nq8T1tfr4rfo1_640.jpg">
            <figcaption class="copyright right"style="color: rgb(83, 58, 3);">
               Image by sheepskeleton on artstation
            </figcaption>   
           <img style="position: absolute; right: 91%;  top: 42%; width: 100px;" src="https://i.pinimg.com/564x/c6/10/5f/c6105feba2db225b5d7e52af0e427584.jpg">
           <figcaption class="copyright right"style="color: rgb(83, 58, 3);">
               Image by altantrengsingf on artstation
           </figcaption> 
        <img style="position: absolute; right: 91%;  top: 65%; width: 100px;" src="https://i.pinimg.com/736x/df/71/bc/df71bc1594556b26d9383e37ece74da5.jpg">
    </p>
    </section>
Homepage, HTML, Webseite, CSS, HTML5, Code, Webdesign, Webentwicklung, Frontend
1 Antwort

Meistgelesene Beiträge zum Thema Webseite
Mehr meistgelesene Fragen zu Webseite