Querdurchstreichung in Befehlen

Hier kann alles Allgemeine rund um Zusi 3 gefragt und beantwortet werden. Neuigkeiten zum Programm werden hier erscheinen.
Nachricht
Autor
Benutzeravatar
Max Senft
Administrator
Beiträge: 3004
Registriert: 04.11.2001 14:01:40
Aktuelle Projekte: Dies und das
Wohnort: Blieskastel, Saarland, Deutschland
Kontaktdaten:

Re: Querdurchstreichung in Befehlen

#41 Beitrag von Max Senft »

Hi,

also von solchen Tricks mit Skalierung "übersteuern" etc. will ich eigentlich immer lieber Abstand halten. Das sieht nämlich eher nach einem nicht korrekt implementierten Feature der Browser aus, als dass es ein Fehler in der Seitenbeschreibung ist. Und wer weiß was passiert, wenn die Browser die Skalierungen dann "richtiger" interpretieren... So Sachen sind mir da irgendwie immer zu heikel.

Gruß
Max
Administrator, Programmierer, Ansprechpartner bei Problemen mit dem Board

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#42 Beitrag von F. Schn. »

Ja, aber davor rettet uns noch eine viewbox.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#43 Beitrag von Johannes »

Der Trick mit den 1000% ist gar nicht so schlimm, wie es im ersten Moment aussieht. Insbesondere implementieren die Browser es auch richtig. Toller Hack uebrigens, darauf waere ich nicht gekommen.

So sollte es normalerweise aussehen (schwarz = Element)

Bild

Wenn man jetzt per background-size den Hintergrund auf mehr als 100% (hier 200%) vergroessert, dann sieht es theoretisch so aus:

Bild

Und wenn man die Strichstaerke noch anpasst, dann theoretisch so:

Bild

Aber weil das Bild ein reiner Hintergrund ist, wird es immer auf die Elementgrenzen beschnitten, sodass es am Ende wieder genau so aussieht, wie es soll:

Bild

Das funktioniert natuerlich nicht bei beliebigen SVGs, aber in diesem Fall schon. (NB. Ich habe in meinem letzten Codeschnipsel den Neigungswinkel des Striches noch ein wenig abgeflacht. Der Strahl geht jetzt von Y=2 nach Y=8 anstatt von 1 nach 9. Sieht m. E. noch besser aus.)
Zuletzt geändert von Johannes am 19.09.2015 00:54:54, insgesamt 1-mal geändert.

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#44 Beitrag von F. Schn. »

Nach ein paar Wochen noch mal Rückfrage @Johannes: Darf ich noch mal fragen, ob das jetzt überall funktioniert, also auch in Wine und beim Drucken?
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#45 Beitrag von Johannes »

Unter XP+IE8 muesste das noch jemand testen.

Unter Windows 8.1 funktioniert es mit dem 1000-Prozent-Trick auch beim Drucken. Da er zu leicht unscharfen Linien fuehrt (bei extrem langen Texten deutlich sichtbar -- solche kommen aber in den Befehlen nicht vor), wuerde ich ihn allerdings trotzdem in ein "@media print{ ... }" einschiessen oder fuer den Spezialfall Drucken weiterhin das gerade Durchstreichen verwenden.

Unter Wine gibt es keine Option, den Hintergrund mitzudrucken, d.h. dort werden die Streichungen nicht gedruckt. Abhilfe: Kugelschreiber nehmen und selber durchstreichen :D

Alwin Meschede
Beiträge: 8926
Registriert: 04.11.2001 19:57:46
Aktuelle Projekte: Zusi3 Objektbau
Kontaktdaten:

Re: Querdurchstreichung in Befehlen

#46 Beitrag von Alwin Meschede »

Also ich tendiere dazu, beim Drucken die alte gerade Durchstreichung zu verwenden, und die schrägen Striche dem Medium Screen vorzubehalten. Das ist mir nämlich bauchgefühlsmäßig insgesamt zu haarig mit dem extra anzukreuzenden oder unter Wine nicht druckbaren Hintergrundbild.
Mein Youtube-Kanal: youtube.com/echoray1

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#47 Beitrag von Johannes »

Auch die alte gerade Durchstreichung benutzt ein Hintergrundbild (PNG statt SVG). Wenn wir auch ohne angekreuztes "Hintergrund drucken" garantiertes Durchstreichen haben wollen, muessen wir "text-decoration: strike-through" verwenden. Dann ist die Durchstreichfarbe aber gleich der Textfarbe und die Strichstaerke laesst sich nicht mehr beeinflussen.

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#48 Beitrag von F. Schn. »

Ich schlag dann mal was vor. So?

Code: Alles auswählen

.durchgestrichen {
   /*background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAAA////pdmf3QAAAAJ0Uk5T/wDltzBKAAAAFUlEQVR42mJgRAUMtOajAzrbDxBgAGNgANOwBVk/AAAAAElFTkSuQmCC");*/
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAD/////e9yZLAAAAAJ0Uk5T/wDltzBKAAAAFklEQVR42mJgRAUM1OaTCmjsHoAAAwBVUAC16xuO+QAAAABJRU5ErkJggg==");
   background-repeat: repeat-x;
   background-position: 0px 1px;
}
html:not([ie8andbelow]) .durchgestrichen {
   background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 10 10'%3E %3Cpath d='M0 9 L10 1' stroke='blue' stroke-width='1' /%3E%3C/svg%3E");
   background-repeat:no-repeat;
   background-position:center center;
   background-size: 100% 100%, auto;
}
@media print {
   .durchgestrichen {
      text-decoration: strike-through;
   }
}
Funktionierten die anderen blauen Element, etwa die x oder die "senkrechte Striche links und recht, die bei den alten Befehlen gültigen Bereiche einrahmen" denn auch beim drucken ohne Hintergrundbild?
Zuletzt geändert von F. Schn. am 05.10.2015 12:51:27, insgesamt 1-mal geändert.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#49 Beitrag von Johannes »

Gegenvorschlag :)

Code: Alles auswählen

.durchgestrichen { /* IE8 unterstützt kein SVG */
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAD/////e9yZLAAAAAJ0Uk5T/wDltzBKAAAAFklEQVR42mJgRAUM1OaTCmjsHoAAAwBVUAC16xuO+QAAAABJRU5ErkJggg==");
   background-repeat: repeat-x;
   background-position: 0px 1px;
}
html:not([ie8andbelow]) .durchgestrichen { /* >= IE9, http://stackoverflow.com/a/20231370/1083696 */
   background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 1000 10'%3E %3Cpath d='M0 8 L1000 2' stroke='MediumBlue' stroke-width='1' /%3E%3C/svg%3E");
   background-repeat:no-repeat;
   background-position:center center;
   background-size: 100% 100%, auto;
}

@media print {
    /* Durchstreichungen sollen unabhängig von der Einstellung "Hintergrund drucken" gedruckt werden, außerdem druckt IE SVG-Hintergründe nicht korrekt. */
   .durchgestrichen, html:not([ie8andbelow]) .durchgestrichen {
      background: none;
      text-decoration: line-through;
      color: MediumBlue;
   }

   .durchgestrichen span {
      color: black;
    }
}
Es muss natuerlich "text-decoration: line-through" heissen. Die Kreuze sind Texte, die Markierungen links und rechts sind Rahmen (border). Sollte beides gedruckt werden.
Zuletzt geändert von Johannes am 05.10.2015 16:06:26, insgesamt 6-mal geändert.

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#50 Beitrag von F. Schn. »

Gefällt mir nicht so, dass wir hier uns jetzt auf nur 2 Media-Types beschränken.

Für das Durchstrechen beim Drucken könnte man auch diesen Trick verwenden: https://de.wikibooks.org/wiki/Websiteen ... dekoration" target="_blank
Damit kann man auch blau durchstreichen - aber dennoch ohne Zugriff auf die Linienstärke.


Edit: Johannes hat beide Vorschläge eingebaut. Werde das dann demnächst testen.
Zuletzt geändert von F. Schn. am 05.10.2015 20:43:06, insgesamt 1-mal geändert.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#51 Beitrag von Johannes »

Hab's angepasst. Wenn man das blaue Durchstreichen machen will, muss man die durchzustreichenden Texte im HTML noch wie folgt anpassen:

Code: Alles auswählen

alt: <zusi id="DSperrfahrt"></zusi>
neu: <zusi id="DSperrfahrt"><span>Sperrfahrt</span></zusi>

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#52 Beitrag von F. Schn. »

So, ich kann jetzt nach einiger Zeit für den letzten Vorschlag auch für XP grünes Licht geben (mit ein paar Ausnahmen, siehe unten). Wenn du noch für Wine mit und ohne IE grünes Licht geben kannst, sollte man mit der Umstellung beginnen können.

Folgendes habe ich getestet:
* Windows 7 + IE: Anzeige ist querdurchgestrichen, Druckvorgang funktioniert sowohl mit als auch ohne Hintergrundbild und ist mit einer dünnen Linie gerade durchgestrichen. (Alles OK)
* Windows 7 + Zusi: genauso wie beim IE (alles OK)
* Windows XP + IE 8: Anzeige ist mit fetter Linie gerade durchgestrichen. Bei Druck wird die @meta print-Anweisung ignoriert, das hat zur Folge, dass beim drucken OHNE Hintergrundbild der Text NICHT durchgestrichen wird. Beim Drucken MIT Hintergundbild wird der Text Fett durchgestrichen. (2 von 3 Okay, das dritte ist IMHO hinnehmbar.)
* Windows XP + aktuelle Firefox-Version: Anzeige ist querdurchgestrichen, Druckvorgang funktioniert sowohl mit als auch ohne Hintergrundbild und ist mit einer dünnen Linie gerade durchgestrichen, ABER Firefox berechnet den Platzbedarf falsch und schneidet rechts gut ein viertel des Textes ab, wenn man ihn die Skalierung automatisch berechnen lässt. Wenn man die Skalierung von Hand auf etwa 90% einstellt druckt Firefox korrekt. (durchstreichen Okay, das andere Problem könnte man ggf. noch mal seperat untersuchen)
* Windows XP + Zusi: Genauso wie beim IE (2 von 3 Okay, das dritte ist IMHO hinnehmbar.)
Edit: Und in allen Fällen ist der Text korrekt schwarz und das Durchstreichen korrekt blau.

Wine habe ich wie gesagt noch nicht testen können, da vertraue ich aber mal Johannes, dass er das selbst testet.
Zuletzt geändert von F. Schn. am 18.10.2015 18:58:18, insgesamt 1-mal geändert.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#53 Beitrag von Johannes »

Das Abschneide-Problem tritt in Firefox also auch mit dem bisherigen, unveraenderten CSS auf, korrekt?

Kannst du in IE8 bitte mal testen, das Druck-Stylesheet in einen eigenen <style>-Tag zu packen:

Code: Alles auswählen

<style type="text/css" media="print">
    /* Durchstreichungen sollen unabhängig von der Einstellung "Hintergrund drucken" gedruckt werden, außerdem druckt IE SVG-Hintergründe nicht korrekt. */
   .durchgestrichen, html:not([ie8andbelow]) .durchgestrichen {
      background: none;
      text-decoration: line-through;
      color: MediumBlue;
   }

   .durchgestrichen span {
      color: black;
    }
</style>
Zuletzt geändert von Johannes am 18.10.2015 19:29:31, insgesamt 1-mal geändert.

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#54 Beitrag von F. Schn. »

Johannes hat geschrieben:Das Abschneide-Problem tritt in Firefox also auch mit dem bisherigen, unveraenderten CSS auf, korrekt?
Ja
Johannes hat geschrieben:Kannst du in IE8 bitte mal testen, das Druck-Stylesheet in einen eigenen <style>-Tag zu packen:
Vorläufiges Ergebnis: Hohe warscheinlichkeit, dass es funktioniert.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#55 Beitrag von Johannes »

F. Schn. hat geschrieben:Vorläufiges Ergebnis: Hohe warscheinlichkeit, dass es funktioniert.
Gibt's da noch ein endgueltiges Ergebnis?

Und Max, wie findest du diese Loesung?

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#56 Beitrag von F. Schn. »

Hm, habe ich jetzt deinen Vorschlag vor deinem Edit oder nach deinem Edit für den Vorhersage benutzt?

Wie auch immer, die Mehrfachangabe überfordert den IE8, aber wenn man die auftrennt ist das Problem behoben.

Hier jetzt noch mal, weleche Änderungen ich alles gemacht habe. Damit hatte es dann bei Windows XP funktioniert.

Ersetzten:

Code: Alles auswählen

alt: <zusi id="...">...</zusi>
neu: <zusi id="..."><span>...</span></zusi>
Ersetzten des alten .durchgestrichen-Blocks gegen

Code: Alles auswählen

.durchgestrichen { /* IE8 unterstützt kein SVG */
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAD/////e9yZLAAAAAJ0Uk5T/wDltzBKAAAAFklEQVR42mJgRAUM1OaTCmjsHoAAAwBVUAC16xuO+QAAAABJRU5ErkJggg==");
   background-repeat: repeat-x;
   background-position: 0px 1px;
}
html:not([ie8andbelow]) .durchgestrichen { /* >= IE9, http://stackoverflow.com/a/20231370/1083696 */
   background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 1000 10'%3E %3Cpath d='M0 8 L1000 2' stroke='MediumBlue' stroke-width='1' /%3E%3C/svg%3E");
   background-repeat:no-repeat;
   background-position:center center;
   background-size: 100% 100%, auto;
}

@media print {
    /* Durchstreichungen sollen unabhängig von der Einstellung "Hintergrund drucken" gedruckt werden, außerdem druckt IE SVG-Hintergründe nicht korrekt. */
   .durchgestrichen, html:not([ie8andbelow]) .durchgestrichen {
      background: none;
      text-decoration: line-through;
      color: MediumBlue;
   }

   .durchgestrichen span {
      color: black;
    }
}
Sowie nach der Zeile </style> einfügen:

Code: Alles auswählen

<style type="text/css" media="print">
    /* Durchstreichungen sollen unabhängig von der Einstellung "Hintergrund drucken" gedruckt werden, außerdem druckt IE SVG-Hintergründe nicht korrekt. */
   .durchgestrichen {
      background: none;
      text-decoration: line-through;
      color: MediumBlue;
   }
   html:not([ie8andbelow]) .durchgestrichen {
      background: none;
      text-decoration: line-through;
      color: MediumBlue;
   }

   .durchgestrichen span {
      color: black;
    }
</style>
Ich hatte das ganze noch bei Wine getestet, aber bin da erhlich gesagt etwas ratlos, weil ich nur auf 1.7.50 gekommen war, und dort hatte - wie du es bereits selbst getetstet hattest - das durchstreichen komplett gefehlt und beim Ausdrucken hatte Firefox rund ein Drittel seitlich abgesäbelt. Vielleicht könntest du das noch mal komplett testen?
Zuletzt geändert von F. Schn. am 28.10.2015 18:40:18, insgesamt 1-mal geändert.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#57 Beitrag von Johannes »

@media print und alles was drin liegt ist dann im ersten <style>-Tag komplett unnoetig, und dass der IE8 mit ".durchgestrichen, html:not([ie8andbelow]) .durchgestrichen" als CSS-Selektor nicht zurechtkommen soll, das waere schon sehr verwunderlich -- ist das echt so?

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#58 Beitrag von F. Schn. »

Mit ".durchgestrichen, .blub" kommt er zurecht. Mit ".durchgestrichen, html:not([ie8andbelow]) .durchgestrichen" aber nicht.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Benutzeravatar
Johannes
Beiträge: 3197
Registriert: 14.03.2009 22:36:06
Aktuelle Projekte: Zusitools (http://git.io/zusitools)

Re: Querdurchstreichung in Befehlen

#59 Beitrag von Johannes »

Kann IE8 bitte einfach mal sterben? Aber ja, ist eigentlich doch ganz logisch, da IE8 ja den :not-Selektor nicht kennt und somit gleich das ganze CSS wegwirft, warum auch immer.

Benutzeravatar
F. Schn.
Beiträge: 6629
Registriert: 24.10.2011 18:58:26

Re: Querdurchstreichung in Befehlen

#60 Beitrag von F. Schn. »

Das würde nur gehen wenn Carsten für XP die Firefox-Vorschaudatei-DLL von Wine übernehmen würde. Das halte ich aber für nicht sehr warscheinlich.

Im übrigen läuft Zusi 3 auf der alten XP-Gurke erstaunlich flüssig, aus irgendeinem verstrahlten Grund wesentlich flüssiger als der Internet Explorer, der im Gegensatz dazu ewigkeiten zum öffnen braucht... Aber sonderlich große Sichtweiten usw. sind natürlich nicht möglich.
Diese Signatur möchte folgendes bekannter machen: ZusiWiki · ZusiSK: Streckenprojekte · YouTube: Objektbau für Zusi · euirc: Zusi-Chat

Antworten