Auflistung aller Lightbox

basti — Tue, 12 Jul 2011 12:52:13 +0000

Ihr sucht eine bestimmte Lightbox für Videos oder Bilder, hier habt Ihr eine komplette Auflistung aller “Lightbox”. Das Gute an der Auflistung, dass Ihr auch Details wie Javascript Library oder verwendbare Objekte mit aufgelistet bekommt.

Lightbox-Liste

HTML – Suchfeld Text bei klick entfernen

basti — Wed, 06 Apr 2011 14:19:30 +0000

Wer in seinem Suchfeld oder seiner Suchmaske einen Text stehen haben möchte ( “Suche” ) der aber nach hinein klicken entfernt werden soll, der muss nur diesen Code einfügen:

Suchbegriff eingeben';" 
onfocus="if(this.value=='Suchbegriff
eingeben')this.value='';" />

Dadurch wird im “input” der Text via onfocus entfernt.

Dynamische Schriftersetzung auf Webseiten mit Cufon

basti — Fri, 15 May 2009 17:32:15 +0000

Heute habe ich das Javascript Tool Cufón getestet und muss sagen, es ist einfach, klein und perfekt. Habe bisher noch keine Probleme im InternetExplorer 6, 7, FireFox2, 3 oder im Safari sehen können. Demo Ihr könnt Euch mal eine .html Datei erstellen und einen Test mit der dynamische Schriftersetzung von Cufón vorbereiten. Das gute an dem ganzen System, der H1 oder H2 Tag wird nicht gelöscht und es wird kein “Bild” erstellt! Der Text bleibt im Tag! Das Negative an dem JavaScript PlugIn, es werden pro Wort ein span erstellt! [ad#posting] Hier mal ein Beispielcode: ( mehr braucht Ihr nicht )

This text will be shown in Frutiger LT Std.

[ad#posting] Achtung: Da die Schrift für da Web freigegeben wird, müsst Ihr die Lizensen bei “Kauf-Schriften” lesen! Wiki: wiki.github.com

Safari/Firefox Fix für schlechtes Textrendering

basti — Wed, 15 Apr 2009 21:36:31 +0000

Einige schlaue Leute haben zwei mögliche Bugfixes gefunden, die das Problem im Safari oder Firefox der Textrendering ( Schrift ) zuverlässig beseitigen. Auf Jonnotie werden beide Ansätze vorgestellt. Hier gibt es eine ausführliche Anleitung: highresolution.info Im zweiten Artikel wird noch beschrieben wie der neue Safari 4 damit klar kommt: jonnotie.nl [ad#posting]

Buchempfehlung

basti — Tue, 22 Apr 2008 15:51:33 +0000

In dieser Rubrik finden Sie die Vorstellung und Beschreibung von Typo3, CSS, XHTML und anderen Büchern, welche ich auch selbst gelesen und benutzt habe. Empfehlenswert sind sie alle. Jedes Buch setzt andere Schwerpunkte, komplett gleiche Beispiele werden Sie ebenfalls nicht finden. Diese Bücher sind perfekt für Anfänger und fortgeschrittene Webmaster!

TYPO3 – Rich Text Editor ( RTE ) Konfiguration

basti — Mon, 17 Mar 2008 10:21:09 +0000

Da ich viel mit Typo3 arbeite, habe ich mir gedacht, zeig ich euch einmal meine Rich Text Editor ( RTE ) Einstellungen: [ad#posting] Fangen wir mit der “Setup” an:

plugin.tx_cssstyledcontent._CSS_DEFAULT_STYLE> ###Content table class disable### lib.parseFunc_RTE.externalBlocks.table.stdWrap. HTMLparser.tags.table.fixAttrib.class> ###p in table disable### lib.parseFunc_RTE.externalBlocks.table.HTMLtableCells.default > lib.parseFunc_RTE.externalBlocks.table.HTMLtableCells.default. stdWrap.parseFunc =< lib.parseFunc

“TS-Config” Eingaben:

# #RTE Classe des Interface (Ausrichtung) # RTE.classes { align-left { name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft value = text-align: left; } align-center { name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter value = text-align: center; } align-right { name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright value = text-align: right; } } #Trage hier ein wo das Bild vor dem Link Entfernt bzw. nicht angezeigt werden soll RTE.classesAnchor { internalLink { class = internal-link type = page image > } externalLink { class = external-link type = url image > } externalLinkInNewWindow { class = external-link-new-window type = url image > } internalLinkInNewWindow { class = internal-link-new-window type = page image > } download { class = download type = file image > } mail { class = mail type = mail image > } } ## RTE Konfiguration RTE.default { # RTE BG-color mainStyle_bgcolor = #ffffff mainStyleOverride_add.BODY = { background-color:#ffffff; background-image:none; } # Zuweisung der CSS-Datei contentCSS = /fileadmin/templates/namevondercssdatei.css useCSS = 1 # Dafür sorgen, dass die Style-Angaben der RTE.default.contentCSS oberste Priorität haben ignoreMainStyleOverride = 0 # Markup options enableWordClean = 1 removeTrailingBR = 1 removeComments = 1 removeTags = removeTagsAndContents = # zeigt alle CSS-Klassen die in .css vorhanden sind showTagFreeClasses = 1 # Tabellen Optionen in der RTE Toolbar hideTableOperationsInToolbar = 0 keepToggleBordersInToolbar = 1 # Tabellen Editierungs-Optionen (cellspacing/ cellpadding / border) disableSpacingFieldsetInTableOperations = 0 disableAlignmentFieldsetInTableOperations=0 disableColorFieldsetInTableOperations=0 disableLayoutFieldsetInTableOperations=0 disableBordersFieldsetInTableOperations=0 # Do not allow insertion of the following tags hideTags = # Buttons die gezeigt/versteckt werden im RTE showButtons = textstyle, textstylelabel, blockstyle, blockstylelabel, bold, italic, underline, left, center, right, orderedlist, unorderedlist, insertcharacter, line, link, image, removeformat, table, toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, findreplace, insertcharacter, undo, redo, showhelp, about, chMode, inserttag hideButtons = fontstyle, formatblock, fontsize, strikethrough,lefttoright, righttoleft, textcolor, bgcolor, textindicator, emoticon, user, spellcheck, outdent, indent, justifyfull, subscript, superscript, acronym, copy, cut, paste # Hält die RTE Icons gegroupt zusammen keepButtonGroupTogether = 1 # blendet Statusbar in htmlarea aus showStatusBar = 0 # Add styles Left, center and right alignment of text in paragraphs and cells. inlineStyle.text-alignment ( p.align-left, h1.align-left, h2.align-left, h3.align-left, h4.align-left, h5.align-left, h6.align-left, td.align-left { text-align: left; } p.align-center, h1.align-center, h2.align-center, h3.align-center, h4.align-center, h5.align-center, h6.align-center, td.align-center { text-align: center; } p.align-right, h1.align-right, h2.align-right, h3.align-right, h4.align-right, h5.align-right, h6.align-right, td.align-right { text-align: right; } ) # Tags die erlaubt werden bzw. verboten werden ( allow / deny ) proc.entryHTMLparser_db.allowTags < RTE.default.proc.allowTags proc { # tags die erlaubt sind allowTags = table, tbody, tr, th, td, h1, h2, h3, h4, h5, h6, div, p, br, span, ul, ol, li, re, blockquote, strong, em, b, i, u, sub, sup, strike, a, img, nobr, hr, tt, q, cite, abbr, acronym, center # tags die verboten sind denyTags = font # br wird nicht zu p konvertiert dontConvBRtoParagraph = 1 # tags sind erlaubt außerhalt von p, div allowTagsOutside = img,hr,span # erlaubte attribute in p, div tags keepPDIVattribs = align,class,style,id,span # Trage hier ein welche tags in zb. span erlaubt sind ( müssen übereinstimmen mit deiner .css ) allowedClasses ( external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail, align-left, align-center, align-right, text_red, text_grun ) # html parser einstellungen HTMLparser_rte { # tags die erlaubt/verboten sind allowTags < RTE.default.proc.allowTags denyTags < RTE.default.proc.denyTags # tags die untersagt sind removeTags = font # entfernt html-kommentare removeComments = 1 # tags die nicht übereinstimmen werden nicht entfernt (protect / 1 / 0) keepNonMatchedTags = 0 } # Content to database entryHTMLparser_db = 1 entryHTMLparser_db { # tags die erlaubt/verboten sind allowTags < RTE.default.proc.allowTags denyTags < RTE.default.proc.denyTags # CLEAN TAGS noAttrib = b, i, u, strike, sub, sup, strong, em, quote, blockquote, cite, tt, br, center rmTagIfNoAttrib = font # htmlSpecialChars = 1 ## align attribute werden erlaubt tags { p.fixAttrib.align.unset > p.allowedAttribs = class,style,align div.fixAttrib.align.unset > hr.allowedAttribs = class span.fixAttrib.style.unset> ## b und i tags werden ersetzt (em / strong) b.remap = strong i.remap = em ## img tags werden erlaubt img> ## span tags werden erlaubt span > } } } # Classes: Ausrichtung classesParagraph ( align-left, align-center, align-right ) # Classes: Eigene Stile classesCharacter = text_red allowedClasses (text_red) # Classes: Eigene Stile classesCharacter = text_grun allowedClasses (text_grun) classesImage= rte_image # Classes für Links (These classes should also be in the list of allowedClasses) classesAnchor = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail classesAnchor.default { page = internal-link url = external-link-new-window file = download mail = mail } } # Use same processing as on entry to database to clean content pasted into the editor RTE.default.enableWordClean.HTMLparser < RTE.default.proc.entryHTMLparser_db # FE RTE configuration (htmlArea RTE only) RTE.default.FE < RTE.default RTE.default.FE.userElements > RTE.default.FE.userLinks> # Breite des RTE in Fullscreen-Ansicht TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 80%

Bei fragen oder Problemen könnt Ihr gerne die Kommentarfunktion benutzen!

min-height für Internet-Explorer 6

basti — Fri, 14 Mar 2008 15:56:54 +0000

Leider kann der Internet Explorer 6 kein CSS 2.0 – minimale Höhe “min-height”, doch mit diesem CSS-Hack funktioniert es (CSS level 2.1 Valide):

CSS CODE:selector { min-height:500px; height:auto !important; height:500px; }

ingeniumdesign blog » HTML