SIFR: Wie viel ist zu viel?

Question

Erstes Plakat hier, mit dem "sifr3-r436" Build.

Ich arbeite auf der Website meiner Firma und entschied, dass es Zeit für uns war, SIFR-Technologie einzusetzen. Bis jetzt konnte ich es ziemlich leicht herausfinden, mit Ausnahme von ein oder zwei Fragen. Grundsätzlich habe ich zwei brennende Fragen, die ich gerne beantwortet hätte.

1) Wie viel SIFR gilt als "ok"? Obwohl ich SIFR nur für Überschriften verwende, habe ich nach den Empfehlungen im FAQ/Walk-Through noch eine beträchtliche Menge an Text, den ich gerne in SIFR umwandeln würde. Bitte sehen Sie the website, um eine Vorstellung davon zu bekommen, wie viel SIFR ich benutze (Rockwell Fontüberschriften und Untertitel). Ist das zu viel?

2) Wie kontrolliere ich die Schriftfarbe mit SIFR? Offensichtlich kann ich es innerhalb der 'sifr-config.js'-Datei einstellen. Allerdings habe ich viele verschiedene farbige Schlagzeilen haben die Ich mag würde verwenden .. Ich mache es momentan so aus:

sIFR.replace(rockwell, { 
selector: '.h3_sifr', css: '.sIFR-root { font-size: 18px; background-color: #a63f03; color: #bf7e04;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_green', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #597704;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_maroon', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #330000;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_blue', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #005995;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_cruise', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #016EA1;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_australia', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #277c5d;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_intl', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #1b2f15;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_us', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #32588b;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_hawaii', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #4a1e52;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_rail', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #304c2a;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_canada', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #0a2754;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_alaska', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #083c4b;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_sadc', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #630002;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_easternus', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #8b3100;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_lightgray', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #999999;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_medgray', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #666666;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_darkgray', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #333333;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_extended', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #175700;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 
sIFR.replace(rockwell, { 
selector: '.h3_sifr_orange', css: '.sIFR-root { font-size: 18px; background-color: #FFFFFF; color: #a63f03;}', forceSingleLine: true, wmode: 'transparent', tuneHeight: -5, 
}); 

Nun, wie Sie, die einzige Möglichkeit sehen kann ich in der Lage gewesen, die anders zu tun colors ist durch eine separate replace-Anweisung für jede Farbe. Ich habe versucht, die Farbe 'inline' (d. H. <span class="h3_sifr" style="color:#123456></span>) zu ändern, aber das funktioniert nicht. Irgendwelche Tipps?

Answer 1

Ich denke, Sie verwenden ein bisschen zu viel sIFR. Beschränken Sie es nur auf die Hauptheader und ersetzen Sie die Links nicht.

Das CSS-Problem ist ein bisschen eine Gurke, keine einfache Antwort dort. Sie können die anderen freigegebenen Eigenschaften jedoch auf das Objekt rockwell kopieren, sodass Sie diese nicht wiederholen müssen.

Auch versuchen, Transparenz zu vermeiden, und Sie sollten nicht forceSingleLine ich denke, verwenden müssen.