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-10-2009, 16:33
fabio
 Registrierter Benutzer
Links : Onlinestatus : fabio ist offline
Registriert seit: Aug 2003
Ort: Wetzikon, ZH, CH
Beiträge: 408
fabio ist zur Zeit noch ein unbeschriebenes Blatt
Lightbulb [gelöst] DIV-Container schrittweise skalieren

Hi

gibt es eine Möglichkeit, ein DIV-Container nicht kontinuierlich mit dem Browserfenster zu vergrössern, sondern nur in sagen wir mal 100 Pixel Schritten?

Also wenn das Browserfenster 842 px breit ist, wäre der DIV 800 px, hätte das Fenster noch 488 px, wäre der DIV nurnoch 400 px.
Mit Zitat antworten
  #2 (permalink)  
Alt 14-10-2009, 16:40
AmicaNoctis
  Moderatorin
Links : Onlinestatus : AmicaNoctis ist offline
Registriert seit: Jul 2009
Beiträge: 5.709
Blog-Einträge: 9
AmicaNoctis sorgt für eine eindrucksvolle AtmosphäreAmicaNoctis sorgt für eine eindrucksvolle Atmosphäre
Standard

Hallo,

mal abgesehen von "Warum willst du das machen?" geht das mit JavaScript.

Gruß,

Amica

PS: Warum willst du das machen?
Mit Zitat antworten
  #3 (permalink)  
Alt 14-10-2009, 17:03
fabio
 Registrierter Benutzer
Links : Onlinestatus : fabio ist offline
Registriert seit: Aug 2003
Ort: Wetzikon, ZH, CH
Beiträge: 408
fabio ist zur Zeit noch ein unbeschriebenes Blatt
Standard



Dass es mir JavaScript geht ist mir klar, damit könnte man ziemlich einfach die Breite auslesen, auf 100 pixel runten und aufs DIV anwenden.
Ich wollte nur schauen ob das auch irgendwie per CSS geht, da ich wenn möglich auf JavaScript verzichten wollte.

Das "warum" zeig ich dir gerne.
http://img.skitch.com/20091003-cbfrq...md8aat6khx.jpg
In der Katalogansicht werden die Artikel so in Boxen aufgeteilt (links Foto, rechts kurzer Text) welche 300 Pixel breit sind (100px hab ich oben nur wegen der Einfachheit genommen).

Desto grösser das Browserfenster wird, desto mehr solche "300px-Boxen" passen natürlich rein, damit der Platz besser genutzt werden kann. Logisch eigentlich
Jetzt hat es ja in den unteren beiden Fenster (link oben) einen Balken oben und unten, wo das Logo, Seitenzahl, etc ist.
Schön wäre es, wenn das Logo dann genau mit dem hintersten Produkt bündig wäre, und nicht genau (im unglücklichsten Falle) 299 Pixel überhängt.

Das ganze ist nicht so super tragisch, ich dachte nur, wenn es eine saubere Methode für das Vorhaben gäbe könnte ich es nutzen.
Wenn es aber ne riesen Bastelsache wäre würde ich es lieber lassen und halt die 299 überhängende Pixel in Kauf nehmen.
Mit Zitat antworten
  #4 (permalink)  
Alt 14-10-2009, 19:10
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.722
Kropff befindet sich auf einem aufstrebenden Ast
Standard

Ich nehme mal an, du arbeitest hier mit float: left. Warum drehst du das nicht einfach um und arbeitest mit float: right? Dann sollte der gewünschte Effekt eintreten.

Peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #5 (permalink)  
Alt 14-10-2009, 21:24
fabio
 Registrierter Benutzer
Links : Onlinestatus : fabio ist offline
Registriert seit: Aug 2003
Ort: Wetzikon, ZH, CH
Beiträge: 408
fabio ist zur Zeit noch ein unbeschriebenes Blatt
Standard

Ja eben, weil wenn mit float:right gearbeitet wird, der abstand nach rechts ja immer gleich ist.
Der ist ja aber im Idealfall ja nicht immer gleich, sondern mehr dem Inhalt angepasst
Mit Zitat antworten
  #6 (permalink)  
Alt 14-10-2009, 21:32
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.722
Kropff befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von fabio Beitrag anzeigen
Ja eben, weil wenn mit float:right gearbeitet wird, der abstand nach rechts ja immer gleich ist.
Der ist ja aber im Idealfall ja nicht immer gleich, sondern mehr dem Inhalt angepasst
Bei einem float: right platscht der Inhalt recht an das umgebende Element an. Wenn dies dann genau so ausgerichtet wird, wie zum Beispiel das übergeordnete Element des "Logo" und Zahlen-Containers, dann sollte das passen. Btw: gibt es ein Online-Beispiel? Ansonsten poste mal den relevanten(!) Code. Nicht den kompletten!

Peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #7 (permalink)  
Alt 14-10-2009, 21:38
AmicaNoctis
  Moderatorin
Links : Onlinestatus : AmicaNoctis ist offline
Registriert seit: Jul 2009
Beiträge: 5.709
Blog-Einträge: 9
AmicaNoctis sorgt für eine eindrucksvolle AtmosphäreAmicaNoctis sorgt für eine eindrucksvolle Atmosphäre
Standard

Hallo Fabio,

ich hab grad etwas gegrübelt, ob es mit lustigen float-Tricks und absoluter/relativer Positionierung klappen könnte, aber bis jetzt sieht das nicht nach einem funktionierenden Ansatz aus.

Du wirst wohl um JS nicht drumherum kommen, wenn du das erreichen möchtest.

Gruß,

Amica
Mit Zitat antworten
  #8 (permalink)  
Alt 14-10-2009, 21:55
Kropff
  Administrator
Links : Onlinestatus : Kropff ist offline
Registriert seit: Mar 2002
Ort: Köln
Beiträge: 11.722
Kropff befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von AmicaNoctis Beitrag anzeigen
Du wirst wohl um JS nicht drumherum kommen, wenn du das erreichen möchtest.
Da bin ich mir noch nicht so sicher. Ich glaube, dass geht auch mit CSS. Aber ohne weitere Infos .

Peter
__________________
Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
Meine Seite
Mit Zitat antworten
  #9 (permalink)  
Alt 14-10-2009, 22:32
AmicaNoctis
  Moderatorin
Links : Onlinestatus : AmicaNoctis ist offline
Registriert seit: Jul 2009
Beiträge: 5.709
Blog-Einträge: 9
AmicaNoctis sorgt für eine eindrucksvolle AtmosphäreAmicaNoctis sorgt für eine eindrucksvolle Atmosphäre
Standard

@Kropff: Ok, hast ja recht...

Hab was hinbekommen, was aber aus Sicht von Layout/Content Separation trotzdem hirnrissig bleibt und immer noch nach JS schreit.
Mit Zitat antworten
  #10 (permalink)  
Alt 15-10-2009, 00:33
fabio
 Registrierter Benutzer
Links : Onlinestatus : fabio ist offline
Registriert seit: Aug 2003
Ort: Wetzikon, ZH, CH
Beiträge: 408
fabio ist zur Zeit noch ein unbeschriebenes Blatt
Standard

@Kropff
Ich habe beim lesen (war unterwegs hatte nicht gross Zeit zu überlegen vor'm antworten) irgendwie das float mit align verwechselt.
Es besteht bis jetzt noch kein Stück Code. Das sind alles nur Photoshopmontagen, halt mit Browserfenster und so dass es "echt" ausschaut, aber Code existiert noch keinen.
Ich bin momentan noch am abklären, welche Ideen die wir beim Entwurf hatten auch realisierbar sind.

@AmicaNoctis
Danke für dein Bemühen, aber der HTML Code schaut ja nicht gerade übersichtlich aus, funktioniert zwar aber ist ja auch nicht wirklich semantisch.

Ich glaube ich werde das einfacher lösen müssen, und es einfach gleichmässig skalieren. Ich kann dann immernoch mittels Javascript (falls vorhanden) den Container anpassen. Das mit JavaScript zu lösen ist ja nicht wirklich schwer und das werd ich dann schon machen können.

vielen Dank euch beiden für die Zeit und's Antworten
Mit Zitat antworten
  #11 (permalink)  
Alt 15-10-2009, 06:45
AmicaNoctis
  Moderatorin
Links : Onlinestatus : AmicaNoctis ist offline
Registriert seit: Jul 2009
Beiträge: 5.709
Blog-Einträge: 9
AmicaNoctis sorgt für eine eindrucksvolle AtmosphäreAmicaNoctis sorgt für eine eindrucksvolle Atmosphäre
Standard

Guten Morgen,

Zitat:
Zitat von fabio Beitrag anzeigen
der HTML Code schaut ja nicht gerade übersichtlich aus, funktioniert zwar aber ist ja auch nicht wirklich semantisch.
Sag ich ja:

Zitat:
Zitat von AmicaNoctis Beitrag anzeigen
aus Sicht von Layout/Content Separation trotzdem hirnrissig
Ich wollte nur versuchen, Kropff zu beweisen, dass es nicht ohne JS geht - nun ja, ich bin "gescheitert"

Gruß,

Amica
Mit Zitat antworten
Antwort

Lesezeichen


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

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Bilder skalieren AgnosticMantis Apps und PHP Script Gesuche 4 27-03-2009 14:22
Div-Container in Div-Container zentrieren mKorniK HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 7 10-07-2007 23:45
Container 3 und 2 in Container 1 einschliessen ecruoserphp HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS 1 23-10-2006 12:19
Bild skalieren andyk80 PHP Developer Forum 7 30-10-2005 12:33
Schrittweise zählen LiOfAgony SQL / Datenbanken 2 04-02-2003 09:02

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

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
PHP WEB STATISTIK ansehen PHP WEB STATISTIK

Die PHP Web Statistik bietet Ihnen ein einfach zu konfigurierendes Script zur Aufzeichnung und grafischen und textuellen Auswertung der Besuchern Ihrer Webseite. Folgende zeitlichen Module sind verfügbar: Jahr, Monat, Tag, Wochentag, Stunde Folgende son

28.08.2018 phpwebstat | Kategorie: PHP/ Counter
Affilinator - Affilinet XML Produktlisten Skript

Die Affilinator Affilinet XML Edition ist ein vollautomatisches Skript zum einlesen und darstellen der Affili.net (Partnerprogramm Netzwerk) Produktlisten und Produktdaten. Im Grunde gibt der Webmaster seine Affilinet PartnerID ein und hat dann unmittelb

27.08.2018 freefrank@ | Kategorie: PHP/ Partnerprogramme
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 06:13 Uhr.