php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #1 (permalink)  
Alt 14-03-2005, 09:45
deklarmart
 Junior Member
Links : Onlinestatus : deklarmart ist offline
Registriert seit: Sep 2002
Ort: # my_home.php - line 213 ;-)
Beiträge: 112
deklarmart ist zur Zeit noch ein unbeschriebenes Blatt
Standard JS Mischung aus Tooltip und Contextmenü

hallo zusammen.

kann mir gar nicht vorstellen das ich generell der erste mit dieser art von wunsch bin^^...
ich möchte eine mischung aus tool-tip und context menü programmieren.

- tooltip deswegen, weil eine ebene (ich denke mal, diese müsste ich dazu nehmen)
dynamisch auf jeder position der seite eingeblendet werden sollte

- und context menü, weil diese ebene links enthalten soll.

ich habe mal eine fotomontage gemacht, damit ihr wisst was ich meine:

also es geht um eine bilder-auflistung im "windows-arbeitsplatz-stil" neben
jeder grafik möchte ich einen kleinen button haben, über den man verschiedene
aktionen für das bild auswählen kann (bearbeiten, umbenennen, löschen) etc.



problem:
ich weiß das man div-layers nur mit statischen angaben (oben links vom monitor, oder?)
positionieren kann. das bringt mir aber nichts. bzw ich hab letztens gesehn,
das man seit neustem divs mit prozenz-angaben versehen kann? ist das ne neuerung von html 4.0 oder was?^^
(hab leider schon seit mehreren jahren nicht mehr wirklich mit html gearbeitet)

überlegung:
um mich wieder bissel ins thema rein zu lesen habe ich mal bei selfhtml reingeschaut.
dort gibt es eine nette demo zum auslesen von daten/angaben von allen elementen,
die auf einer HTML seite sind. (http://de.selfhtml.org/dhtml/beispie.../dhtmltest.htm)

fragen:
1) ist es möglich auf diese weise die position von meiner kleinen grauen
grafik (die das menü öffnet) abzufangen und dann mit diesen werten die
div-ebene zu positionieren, damit sie genau an der stelle des pfeil-bildes erscheint?

2) da ich mir eigentlich ziemlich sicher bin das ich nicht der erste sein kann, der soetwas
programmieren möchte: wie nennt man diese art von menü?
die suche bei google nach "tooltip" und "contextmenü" brachte für mich keine
brauchbaren beispiele/ergebnisse.

3) ist es überhaupt (generell) möglich, mein vorhaben annähernd umzusetzen?



wäre nett, wenn jemand etwas weiß, wo man weiter suchen kann bzw wie
man sowas nennt usw.

vielen dank soweit,
gruß dek*
__________________
GLORIA PERPETUA
Mit Zitat antworten
  #2 (permalink)  
Alt 14-03-2005, 09:53
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.786
Kropff befindet sich auf einem aufstrebenden Ast
Standard

du kannst mehrere divs verschachteln, also auch mit den positionen spielen.z.b.:
PHP-Code:
<div style="width: 90%; left: 5%; height: 90%; bottom:5%; border: 1px solid #f00">
<
div style="width: 100px; left: ;10px height: auto; top:10px; border: 1px solid #00f">bla bla</div>
</
div
schau dir das mal an, dann wirst du sicher eine lösung funden (ungetestet)
peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #3 (permalink)  
Alt 14-03-2005, 10:04
asp2php
 Banned
Links : Onlinestatus : asp2php ist offline
Registriert seit: Feb 2004
Beiträge: 11.745
asp2php ist zur Zeit noch ein unbeschriebenes Blatt
Standard

http://www.walterzorn.com/tooltip/tooltip_e.htm
Mit Zitat antworten
  #4 (permalink)  
Alt 14-03-2005, 10:23
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard Re: JS Mischung aus Tooltip und Contextmenü

Zitat:
Original geschrieben von deklarmart
ich weiß das man div-layers nur mit statischen angaben (oben links vom monitor, oder?) positionieren kann.
das ist kein "wissen", sondern schlichtweg blödsinn.

Zitat:
bzw ich hab letztens gesehn, das man seit neustem divs mit prozenz-angaben versehen kann? ist das ne neuerung von html 4.0 oder was?
das hat mit HTML so gut wie gar nichts zu tun.
CSS ist das stichwort - und da möchtest du dich u.a. mit den verschiedenen möglichkeiten für position beschäftigen.
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #5 (permalink)  
Alt 15-03-2005, 12:36
deklarmart
 Junior Member
Links : Onlinestatus : deklarmart ist offline
Registriert seit: Sep 2002
Ort: # my_home.php - line 213 ;-)
Beiträge: 112
deklarmart ist zur Zeit noch ein unbeschriebenes Blatt
Standard

entschuldigung! ok, das ist natürlich eine feine sache, das die positionierung
ab dem eltern-element funktioniert! hat die sache sehr vereinfacht, und ich
habs im grunde auch schon fertig.

nur eine kleinigkeit ist da noch: leider werden die eingeblendeten ebenen nicht
über die andern elemente der html seitegelegt, sondern schieben sich
irgendwie dazwischen! ich dachte erst, das hat mit dem z-index zu tun und
hab dann diverse einstellungen vorgenommen... aber das interessiert die ebene
nicht!

hier das beispiel:
http://www.zir-con.de/web-tmp/demo.html

öffnet sich die ebene, verschieben sich die anderen elemente nach unten! egal
ob ich z-index 2, 100 oder -1 angebe! woran liegt das?

html-code:
Code:
<script language="javascript">

last_id='0';

function getMenu(id) {
	if (document.getElementById('menu' + id).style.display == 'none') {
		document.getElementById('menu' + last_id).style.display = 'none';
		document.getElementById('menu' + id).style.display = '';
	} else {
		document.getElementById('menu' + id).style.display = 'none';
	}
	last_id=id;
}

</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<br><br><div id="menu0"></div>

<div name="menubutton">
  <img src="pfeil.jpg" width="20" height="10" border="0" onclick="getMenu(1);" style="cursor: hand;">
  <div id="menu1" style="position: relative; top: 0px; width: 200px; height: 100px; z-index: -1;
    background-color: blue; display: none;">asd</div>
</div>
<br>blablabla<br><br>
<div name="menubutton">
  <img src="pfeil.jpg" width="20" height="10" border="0" onclick="getMenu(2);" style="cursor: hand;">
  <div id="menu2" style="position: relative; top: 0px; width: 200px; height: 100px; z-index: 2;
    background-color: blue; display: none;">asd</div>
</div>
<hr>
__________________
GLORIA PERPETUA

Geändert von deklarmart (16-03-2005 um 13:13 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 15-03-2005, 15:51
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Original geschrieben von deklarmart
woran liegt das?
das könnte dir vielleicht jemand sagen, der weiß, was deine funktion getMenu() macht ...
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #7 (permalink)  
Alt 16-03-2005, 12:19
deklarmart
 Junior Member
Links : Onlinestatus : deklarmart ist offline
Registriert seit: Sep 2002
Ort: # my_home.php - line 213 ;-)
Beiträge: 112
deklarmart ist zur Zeit noch ein unbeschriebenes Blatt
Standard

die funktion ändert eigentlich nur die "display" eigenschaft. ich dachte,
das es daran nicht liegen kann, daher hatte ich die weggelassen! aber
um den zusammen hang zu sehen ist es natürlich sinnvoller die auch zu
posten, sorry. hab es nachgeholt: oben steht nun auch die funktion!
__________________
GLORIA PERPETUA
Mit Zitat antworten
  #8 (permalink)  
Alt 16-03-2005, 12:56
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

und was ist display ...?

laut selfhtml: "display (Anzeigeart bzw. Nichtanzeige ohne Platzhalter)"

also wird, wenn das element ausgeblendet ist, kein platz dafür reserviert - und wenn es eingeblendet wird, nimmt sich das element den notwendigen platz.

folge: nachfolgende elemente verschieben sich nach unten.

"alternative" wäre visibility statt display - das ist nichtanzeige mit platzhalter. dann würde der platz für das element immer reserviert, auch wenn es nicht angezeigt wird.
nachfolgende elemente halten dann gleich den nötigen abstand ein - allerdings gibt das leere flächen an der stelle, wo das element nicht eingeblendet ist.


die wirkliche alternative: die tooltipps per absoluter positionierung aus dem elementfluss nehmen, so dass sie beim einblenden über display dann "über" den nachfolgenden elementen erscheinen, so dass diese sich nicht mehr verschieben.
dabei berücksichtigen, dass absolute positionierung sich durchaus relativ verhält - relativ zu den koordinaten des nächsthöheren vorfahrenelementes mit einem vom default static abweichenden wert für position.




p.s.:
Zitat:
hab es nachgeholt: oben steht nun auch die funktion!
dann bitte jetzt noch den scrollbalken beseitigen!
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #9 (permalink)  
Alt 16-03-2005, 13:25
deklarmart
 Junior Member
Links : Onlinestatus : deklarmart ist offline
Registriert seit: Sep 2002
Ort: # my_home.php - line 213 ;-)
Beiträge: 112
deklarmart ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Zitat:
Original geschrieben von wahsaga
die wirkliche alternative: die tooltipps per absoluter positionierung aus dem elementfluss nehmen, so dass sie beim einblenden über display dann "über" den nachfolgenden elementen erscheinen, so dass diese sich nicht mehr verschieben.
dabei berücksichtigen, dass absolute positionierung sich durchaus relativ verhält - relativ zu den koordinaten des nächsthöheren vorfahrenelementes mit einem vom default static abweichenden wert für position.

hm, das versteh ich nicht ganz! also ich soll die tooltip-ebenen aus dem
"element-fluss" rausnehmen, indem ich die zB gleich ALLE hinter <body> schreibe?
(also aus dem '<div name="menubutton">' rausnehmen)?

wenn ich das so mache, stimmt die positionierung ja nicht mehr, da die
tooltip-ebenen nun den body als elternelement haben und nun von oben
links aus positioniert werden. wie soll ich an die positionsdaten vom "menubutton"
kommen? oder war dein vorschlag anders gemeint?!

(ich hoffe ich hab mein problem so halbwegs verständlich ausgedrückt^^)
__________________
GLORIA PERPETUA
Mit Zitat antworten
  #10 (permalink)  
Alt 16-03-2005, 13:29
asp2php
 Banned
Links : Onlinestatus : asp2php ist offline
Registriert seit: Feb 2004
Beiträge: 11.745
asp2php ist zur Zeit noch ein unbeschriebenes Blatt
Standard

http://www.css4you.de/position.html
http://www.css4you.de/example/position_relative.html
Mit Zitat antworten
  #11 (permalink)  
Alt 16-03-2005, 13:32
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Original geschrieben von deklarmart
oder war dein vorschlag anders gemeint?!
mein vorschlag war so gemeint, wie fast immer:

lerne mit den techniken, die du verwenden willst, halbwegs sicher umzugehen - so dass du gegebene tipps auch umsetzen kannst, ohne dass man dir alles bis ins kleinste vorkauen muss.
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #12 (permalink)  
Alt 16-03-2005, 14:21
deklarmart
 Junior Member
Links : Onlinestatus : deklarmart ist offline
Registriert seit: Sep 2002
Ort: # my_home.php - line 213 ;-)
Beiträge: 112
deklarmart ist zur Zeit noch ein unbeschriebenes Blatt
Standard

danke auch! mehr als selfhtml zu studieren und versuchen zu verstehen
kann ich nicht! wozu ist denn so ein forum da? ich hab halt paar fragen
zum thema ebenen und positionierung und peil das nicht zu 100 prozent!
schuldigung!

es sind ja nur kleine fehler! ich kann mir selfhtml 1000 mal durchlesen und
finde die lösung nicht! das resultiert sicherlich nicht aus dummheit, sondern
daraus, dass ich nicht die erfahrung damit habe da ich nicht den ganzen tag mit
html/css arbeite. jeder lernt das mal (gerade aus fehlern), aber halt nur wenn man ein wenig
hilfe beim suchen seiner fehler bekommt.



[...]


aber trotzdem danke für die links, ich bin dabei zu kapieren wie das alles
so ca. funktioniert. nur das problem mit der reihenfolge mit übereinander
liegenden objekten hab ich noch! ich hab mir in selfhtml übrigens auch schon
zig-mal alles zum thema "z-index" durchgelesen und ausprobiert!
selbst wenn ich in das <img src...> tag ein 'style="z-index:1"' schreibe
und die divs mit einem z-index von 3 oder so belege, ist das bild
noch on-top! waurm?!
(kann man hier sehen --> http://www.zir-con.de/web-tmp/demo.html )

Code:
<style type="text/css"><!--
.menubar {
  position: absolute;
  top: 16px;
  width: 200px;
  height: 100px;
  background-color: #efefef;
}
// --></style>
<div name="menubutton" style="position: absolute;">
  <div id="menu1" class="menubar" style="display: none;">asd</div>
  <img src="pfeil.jpg" width="20" height="10" border="0" onclick="getMenu(1);" style="cursor: hand;">
</div>
<br>blablabla<br><br>
<div name="menubutton" style="position: absolute;">
  <div id="menu2" class="menubar" style="display: none;">asd</div>
  <img src="pfeil.jpg" width="20" height="10" border="0" onclick="getMenu(2);" style="cursor: hand;">
</div><br>
<hr>
__________________
GLORIA PERPETUA
Mit Zitat antworten
  #13 (permalink)  
Alt 16-03-2005, 14:24
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Original geschrieben von deklarmart
selbst wenn ich in das <img src...> tag ein 'style="z-index:1"' schreibe
und die divs mit einem z-index von 3 oder so belege, ist das bild
noch on-top! waurm?!
(kann man hier sehen --> http://www.zir-con.de/web-tmp/demo.html )
von einem z-index kann ich da weit und breit nichts entdecken.
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #14 (permalink)  
Alt 16-03-2005, 14:28
deklarmart
 Junior Member
Links : Onlinestatus : deklarmart ist offline
Registriert seit: Sep 2002
Ort: # my_home.php - line 213 ;-)
Beiträge: 112
deklarmart ist zur Zeit noch ein unbeschriebenes Blatt
Standard

hatte ich auch wieder rausgenommen, da es nicht funktioniert hat.
(EGAL wo ich es hingeschrieben habe und wie ich die ebenen geordnet
habe. das bild war wie gesagt IMMER on-top)
__________________
GLORIA PERPETUA
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

Projektmanagement Damals und Heute
Projektmanagement Damals und HeuteWerfen Sie einen Blick auf das, was sich verändert hat, und entdecken Sie, wo die Zukunft dieses Gebietes hinsteuert.

18.01.2021 | Berni

Arbeitsmanagement-Tools
Arbeitsmanagement-ToolsWarum jedes Team Arbeitsmanagement-Tools benötigt. Man schätzt, dass 25% eines durchschnittlichen Mitarbeiter-Tages durch ineffiziente Arbeit vergeudet werden.

11.12.2020 | Berni


 

Aktuelle PHP Scripte

Simple Forum PHP ansehen Simple Forum PHP

If you need simple forum or discussion on your website, then you've come to the right place. Simple Forum PHP is a script that is very easy to install and administer.

28.08.2021 nevenov | Kategorie: PHP/ Forum PHP Software
Formmailer Bootstrap 4

Mit dem Formmailer kann man sich eMails über seine Seite zukommen lassen.

08.07.2021 arne-home | Kategorie: PHP/ Formular
Fehlerseite Bootstrap 4

Bei Aufruf einer nicht existierenden Seite, teilen Sie Besuchern mit einer eigenen Fehlerseite mit, dass die gewünschte Seite nicht gefunden wurde. Die eigene Fehlerseite sollte dasselbe Design wie die Website haben. Zudem sollte ein Link zur Startseite a

04.07.2021 arne-home | Kategorie: PHP/ Counter
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 11:00 Uhr.