Css Snippets » pdf http://www.csssnippets.be Snippets for you, snippets for me Wed, 23 Jun 2010 09:35:12 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 CSS Specificiteit – spiekbrief http://www.csssnippets.be/2009/10/css-specificiteit-%e2%80%93-spiekbrief/ http://www.csssnippets.be/2009/10/css-specificiteit-%e2%80%93-spiekbrief/#comments Mon, 12 Oct 2009 07:16:50 +0000 Mark http://www.csssnippets.be/?p=403 CSS Specificity – Cheat Sheet CSS specificiteit is het grootste hindernis nadat je denkt CSS te beheersen, deze spiekbrief (cheat sheet) kan je helpen bij het dag dagelijkse uitdokteren welke CSS regel nu wel, en als niet, waarom niet, uitgevoerd wordt. Je kan het ook proberen te begrijpen met dit Nederlandstalig artikel op Gigadesign]]> CSS Specificity – Cheat Sheet

CSS specificiteit is het grootste hindernis nadat je denkt CSS te beheersen, deze spiekbrief (cheat sheet) kan je helpen bij het dag dagelijkse uitdokteren welke CSS regel nu wel, en als niet, waarom niet, uitgevoerd wordt. Je kan het ook proberen te begrijpen met dit Nederlandstalig artikel op Gigadesign

Download naar believen en behoefte

Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/10/css-specificiteit-%e2%80%93-spiekbrief/feed/ 0 Jquery detecteer links naar documenten http://www.csssnippets.be/2009/09/jquery-detecteer-links-naar-documenten/ http://www.csssnippets.be/2009/09/jquery-detecteer-links-naar-documenten/#comments Wed, 16 Sep 2009 10:03:43 +0000 Mark http://www.csssnippets.be/?p=345 pure CSS oplossing hiervoor.]]> Detecteer links in je website naar documenten – *.doc, *.xls, *.pdf – en voeg de betreffende class toe aan de links, voor als je bijvoorbeeld een icoon wilt toevoegen via CSS. Er bestaat ook een pure CSS oplossing hiervoor.

Jquery

<![CDATA[
$('a[href]').each(function() {
   if((C = $(this).attr('href').match(/[.](doc|xls|pdf)$/))) {
       $(this).addClass(C[1]);
   }
});
]]>
Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/09/jquery-detecteer-links-naar-documenten/feed/ 0 Toon applicatie icon naast link http://www.csssnippets.be/2009/02/toon-applicatie-icon-naast-link/ http://www.csssnippets.be/2009/02/toon-applicatie-icon-naast-link/#comments Thu, 12 Feb 2009 17:45:35 +0000 Mark http://www.csssnippets.be/?p=106 Dit werkt niet in Internet Explorer 6]]> Naast een download link voor een PDF bestand, komt een icon van het PDF logo, naast een download link voor een MP3 komt het icon van een MP3, etc … Dit werkt niet in Internet Explorer 6

HTML

<p><a href="mailto:x@x.com">email</a></p>
<p><a class="popup" href="#">pop up</a></p>
<p><a href="test.doc">word</a> </p>
<p><a href="test.xls">excel</a></p>
<p><a rel="external" href="http://www.test.com">website</a></p>
<p><a href="test.pdf">pdf</a></p>
<p><a rel="pdf" href="test">pdf2</a></p>
<p><a rel="xxpdfxx" href="test">pdf3</a></p>

CSS

/* all A tags whose HREF attribute ends in .pdf */
a[href$='.pdf'] {
	padding-left: 18px;
	background: transparent url(pdf.gif) no-repeat center left;
}
/* all A tags whose REL attribute = pdf */
a[rel='pdf'] {
	padding-left: 18px;
	background: transparent url(pdf.gif) no-repeat center left;
}
/*  all A tags whose REL attributes has the string pdf inside */
a[rel*='pdf'] {
	padding-left: 18px;
	background: transparent url(pdf.gif) no-repeat center left;
}
/* all A tags whose HREF attribute starts with mailto: */
a[href ^="mailto:"] {
	padding-left: 18px;
    background: transparent url(mailto.gif) no-repeat center left;

}
/* all A tags whose CLASS attribute is popup */
a[class ="popup"] {
	padding-left: 18px;
    background: transparent url(popup.gif) no-repeat center left;
}
a[href$='.doc'] {
	padding-left: 18px;
	background: transparent url(doc.gif) no-repeat center left;
}
a[href$='.xls'] {
	padding-left: 18px;
	background: transparent url(xls.gif) no-repeat center left;
}
a[rel ~='external'] {
	padding-left: 18px;
	background: transparent url(external.gif) no-repeat center left;
}
Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/02/toon-applicatie-icon-naast-link/feed/ 2