Css Snippets » afbeeldingen http://www.csssnippets.be Snippets for you, snippets for me Mon, 17 Oct 2011 08:42:00 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 Een loading-image voor grote afbeeldingen http://www.csssnippets.be/2009/12/een-loading-image-voor-grote-afbeeldingen/ http://www.csssnippets.be/2009/12/een-loading-image-voor-grote-afbeeldingen/#comments Thu, 17 Dec 2009 07:44:39 +0000 Mark http://www.csssnippets.be/?p=666 Een klein extra effect wat je kan toevoegen aan je website als je een indicatie wenst te geven dat een grote afbeelding moet worden geladen.

Download afbeelding

  1. bg_cover.gif (128)
  2. Je kan indien je wenst je eigen ajax-loader afbeelding aanmaken via deze website.

HTML

<div class="load">
 <img src="very-large.jpg" alt="alternate text" />
</div>

CSS

.load {
 background:url('images/ajax-loader.gif') no-repeat center;
 width: 200px;
 height: 200px;
}
Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/12/een-loading-image-voor-grote-afbeeldingen/feed/ 0 Ronde hoeken, met 4 afbeeldingen http://www.csssnippets.be/2009/05/ronde-hoeken-met-4-afbeeldingen/ http://www.csssnippets.be/2009/05/ronde-hoeken-met-4-afbeeldingen/#comments Thu, 14 May 2009 12:10:29 +0000 Mark http://www.csssnippets.be/?p=212 voor elke hoek één), en 4 HTML elementen op ze op hun plaats te zetten. Eenvoudig en doeltreffend.]]> Ronde hoeken kan je op zoveel verschillende manieren verwezenlijken, de ene is al wat gecompliceerder dan de andere. Deze manier heeft 4 afbeeldingen nodig (voor elke hoek één), en 4 HTML elementen op ze op hun plaats te zetten. Eenvoudig en doeltreffend.

HTML

<div class="w1">
 <div class="w2">
  <div class="w3">
   <div class="w4">
    Hallo, tekst komt hier
   </div>
  </div>
 </div>
</div>

CSS

div.w1{
background:#9c6634 url(images/tl.gif) no-repeat;
width:100%;
width: 250px;
}
div.w2{
background:url(images/tr.gif) no-repeat top right;
}
div.w3{
background:url(images/bl.gif) no-repeat left bottom;
}
div.w4{
background:url(images/br.gif) no-repeat right bottom;
padding:10px;
}
Google Bookmarks Digg BlinkList Technorati del.icio.us StumbleUpon

]]> http://www.csssnippets.be/2009/05/ronde-hoeken-met-4-afbeeldingen/feed/ 0