"nach oben"-Button-Position fixieren

Hallo Leute,

mein "nach oben" Button zeigt keine Funktion und ich bin am rätseln warum
Code bei "CSS-Code ohne Styletags":

Code bei "Text unter dem Design":

was stimmt da nicht danke für Hilfe
______________
mfG design-globe

<id="nach_oben">
Was soll denn das sein?
Ein Tag ohne Name nur mit ID-Attribut?
Wenn das das Sprungziel sein soll, zu dem hingescrollt wird, dann wird das so nicht funktionieren, da das kein valides HTML ist. Du kannst das ID-Attribut zu einem beliebigen HTML-Tag hinzufügen, aber quasi stand-alone geht nicht.

href="#nach_oben" bewirkt, dass der Browser zu einem Element mit der ID nach_oben scrollt (was es derzeit aber nicht gibt). Wenn du aber ohnehin nach ganz oben möchtest genügt href="#"
______________
- Signatur vom Mod Team angepasst -
Bitte keine Werbung für fremde Projekte

=> Das ist sehr schade. Ich habe mich hier im Forum über viele Jahre engagiert und einfach meine Signatur zu verändern zeugt von mangelnder Wertschätzung für meine Beiträge, die einzig den Nutzern des Homepage-Baukastens zugute kamen. Spätestens mit der Reduzierug auf max. 10 Unterseiten* sind die guten Zeiten des Baukastens ohnehin vorbei und die einst große Gremeinschaft im Forum hat sich längst aufgelöst. Nun bin ich hier offenbar auch nicht länger erwünscht. Bleibt mir nur lebewohl zu sagen, es waren schöne 14 Jahre und der Baukasten hat mir immer viel Spass gemacht - machts gut und eventuell trifft man sich ja doch nochmal an anderer Stelle im Internet. (07.06.2020)
* mittlerweile sogar nur noch 5

mich mal gründlich schäme, ok jetzt mit # gehts
noch ein kleines Problem gibts, mir gehts zu schnell nach oben
im CSS-Code ist ja extra eine transition-Anweisung, wie muss ich diese ändern
...und die Hoverfunktion geht auch nicht

/* transition Button */
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s; }

/* Hover bei Mauskontakt Button */
#nach_oben a:hover {
color: #000000;
background-color: #fff400;}


vielen dank freefunstuff

Die Transitions-Definitionen, zu was sind die zugeordnet? Es geht zwar eine Klammer zu, aber wo geht die auf und was ist der zugehörige Selektor? Das gleiche gilt für "abgerundete Ecken Button", du hast nirgends definiert, was denn nun "Button" ist, also wofür diese Regeln gelten sollen.
Eine CSS Regel muss sich immer wie folgt aufbauen: Selektor { Regeln }
Der Selektor entscheidet welche HTML Elemente angesprochen werden sollen und die Regeln was mit diesen Elementen optisch passieren soll.

Ob man mit CSS eine Transition für das Springen zu einem Anker definieren kann weis ich nicht,... notfalls müsstest du das langsame Scrollen mit JavaScript umsetzen.

Die für hover definierten Regeln greifen noch nicht, da du weiterhin <id="nach_oben"> ... </id="nach_oben"> nutzt. Ersetze diese beiden durch das folgende und es sollte hinhauen: <div id="nach_oben"> ... </div>
______________
- Signatur vom Mod Team angepasst -
Bitte keine Werbung für fremde Projekte

=> Das ist sehr schade. Ich habe mich hier im Forum über viele Jahre engagiert und einfach meine Signatur zu verändern zeugt von mangelnder Wertschätzung für meine Beiträge, die einzig den Nutzern des Homepage-Baukastens zugute kamen. Spätestens mit der Reduzierug auf max. 10 Unterseiten* sind die guten Zeiten des Baukastens ohnehin vorbei und die einst große Gremeinschaft im Forum hat sich längst aufgelöst. Nun bin ich hier offenbar auch nicht länger erwünscht. Bleibt mir nur lebewohl zu sagen, es waren schöne 14 Jahre und der Baukasten hat mir immer viel Spass gemacht - machts gut und eventuell trifft man sich ja doch nochmal an anderer Stelle im Internet. (07.06.2020)
* mittlerweile sogar nur noch 5

jetzt passts überhaupt nicht mehr
der Button sitzt unter dem Design und nicht im Footer und Hover geht trotzdem auch nicht

Du kannst die ID natürlich auch direkt im Link angeben:
<a href="#" id="nach_oben">nach oben</a>
Und das dann wieder in den Footer packen, du hast den Code ja jetzt außerhalb des Footers.

Oder du machst alles wie zuvor und nimmst nimmst anstatt div einfach span, wenn du nicht möchtest, dass es einen Zeilenumbruch gibt.

Dass hover noch nicht funktioniert kann daran liegen, dass du davor die ungültigen CSS Regeln hast:

Hier fehlen die Selektoren, es geht nur eine Klammer zu und keine auf. Mach den Teil weg oder korrigiere ihn.
______________
- Signatur vom Mod Team angepasst -
Bitte keine Werbung für fremde Projekte

=> Das ist sehr schade. Ich habe mich hier im Forum über viele Jahre engagiert und einfach meine Signatur zu verändern zeugt von mangelnder Wertschätzung für meine Beiträge, die einzig den Nutzern des Homepage-Baukastens zugute kamen. Spätestens mit der Reduzierug auf max. 10 Unterseiten* sind die guten Zeiten des Baukastens ohnehin vorbei und die einst große Gremeinschaft im Forum hat sich längst aufgelöst. Nun bin ich hier offenbar auch nicht länger erwünscht. Bleibt mir nur lebewohl zu sagen, es waren schöne 14 Jahre und der Baukasten hat mir immer viel Spass gemacht - machts gut und eventuell trifft man sich ja doch nochmal an anderer Stelle im Internet. (07.06.2020)
* mittlerweile sogar nur noch 5

alles klar - habe im CSS-Code korrigiert
und lasse es jetzt so
danke dir vielmals
______________
mfG design-globe

nun muss ich hier nochmals aufmachen, wegen eines weiteren Problemes
und zwar folgendes:
ich habe auf der rechten Seite den "nach oben "-Button eingefügt und dieser wird bei mir bei einer Auflösung von 1240x1024 px korrekt neben dem Design angezeigt.

Nun hatte ich aber vor einpaar Tagen die Ansicht auf einem Laptop und da sitzt der Button im Footer und verdeckt den Impressum-Button.

Wenn ich dann aber den "nach oben"-Button weiter rechts positioniere ist er bei meiner Ansicht verschwunden (also zu weit rechts für meine Auflösung)

Wie bekomme ich es hin den Button eine fixe Position zu geben So dass er bei jeder Bildschirmauflösung rechts unten erscheint.

Danke für Hilfe

Das liegt an der "schlechten" Positionierung.

beträgt jetzt immer der Abstand vom linken Bildrand aus. Heißt: Ist die Breite der Auflösung kleiner als ~1000px wird dieser nicht angezeigt.
Bin gerade aber überfragt wie du das löst, da margin: auto und position:absolute (left: 50% ...) in diesem Fall keine Lösungen sind.
______________
Gruß Pexxi

hi pexxi,

trotzdem erstmal danke für die Antwort, vielleicht kommt ja nochwas dazu von jemandem
______________
mfG design-globe

Du könntest ein div darum machen ->

So bleibt der Button immer an gleicher Stelle
______________
Gruß Pexxi

sehr gut, vielen dank, das hat schonmal funktioniert
jetzt hätte ich gerne noch drei Dinge die geändert werden müssten
1. der Hovereffekt wird nicht angezeigt (Farbe orange)
2. der Link "nach oben" soll nicht unterstrichen sein und
3. lässt sich der Button auf Höhe des Footers positionieren, weil er ja jetzt etwas weit unten erst angezeigt wird

danke
______________
mfG design-globe

2) #nach_oben a { text-decoration: none; }
3) Ich weiß ja noch gar nicht wie das Deisgn etc. aussieht, schließlich kenne ich die Homepage nicht. Würde aber mit der div-Methode nicht gehen. Dazu muss ich mir aber vorher erstmal ein Bild davon machen
Da der Hover nicht angezeigt wird bezweifle ich, dass 2) funktioniert. Wie gesagt, die Homepage wäre vonnöten
______________
Gruß Pexxi

danke pexxi
habe den Button jetzt eigentlich so , wie er sein soll
und es geht um meine Homepage http://www.design-globe.de/
daher verstehe ich das obere von dir nicht so richtig
der Button ist mir noch etwas zu weit unten und sollte wenn möglich auf Höhe des Footers sein
und der Hover funktioniert nicht (bevor ich diese jetzigen Veränderungen alle gemacht habe ging das aber )

Am besten wäre es, wenn du das nochmal (sofern es möglich ist) auf den Stand von heute morgen bringst. Ich wusste ja nicht, wie das ganze Konstrukt aussah und habe daher mit den vorhandenen Codes aus diesem Thread gearbeitet.
So könnte ich dann sehen wie der Stand ist und darauf auf-/weiterbauen
______________
Gruß Pexxi