[koala]

Originally posted by Schneaker@Mar 2 2005, 02:15
ALA har ett antal artiklar om dropshadows, "min" metod är en snutt lätthanterad kod som gör precis samma som de beskriver i en av sina artiklar

Inte för att jag vill klanka ner på din kod på något vis, men om html-koden blir över 1,5 kb per skuggeffekt så bör man nog överväga att använda några gif-bilder istället :P


Här är min kod (gif-bilderna kan ni sno från ALA eller skapa egna). Jag utelämnar CSS-filen och förklaringar till hur man använder detta. Exempel på resultat: www.y1.se/profiles.php?user_id=17

// CSS-mall:
// .shadowWrap1, .shadowWrap2, .shadowWrap3 {
// display:inline-table;
// /* \*/display:block;/**/} 
// .shadowWrap1 {
// background:url(img/shadow.gif) right bottom no-repeat;}
// .shadowWrap2 {background:url(img/shadow_corner_bl.gif) left bottom no-repeat;}
// .shadowWrap3 {
// padding:0 4px 4px 0;
// background:url(img/shadow_corner_tr.gif) right top no-repeat;}
// .shadowWrapImage {
//  display: block;
//  position: relative;
//  border: 1px solid #000;
// }
// .shadowWrapImage img {
// display:block;
// }


// change these if you must: (all units are pixels)
define('SHADOWSIZE_X', 4); // shadow width
define('SHADOWSIZE_Y', 4); // shadow height
define('PADDING_X', 0); // the total width occupied by paddings in the css
define('PADDING_Y', 0); // the total height occupied by paddings in the css
define('BORDER_X', 2); // the total width occupied by borders in the css
define('BORDER_Y', 2); // the total height occupied by borders in the css



function shadowImage ($imageFile, $altText='', $linkHref='', $linkTarget='', $onClick='') {
	if (!file_exists($imageFile)) {
 trigger_error('File does not exist: '.$imageFile, E_USER_WARNING);
 return '';
	}
	$size = getimagesize($imageFile);
	$x = $size[0];
	$y = $size[1];
	$size = $size[3];
	
	$X = $x + SHADOWSIZE_X + PADDING_X + BORDER_X;
	$Y = $y + SHADOWSIZE_Y + PADDING_Y + BORDER_Y;
	
	
	$linkText = '';
	if (!empty($linkHref)) {
 $linkText = '<a href="'.$linkHref.'"';
 if (!empty($linkTarget)) {
 	$linkText .= ' target="'.$linkTarget.'"';
 }
 $linkText .= ' title="'.$altText.'"';
 if (!empty($onClick)) {
 	$linkText .= ' onclick="'.$onClick.'"';
 } 
 $linkText .= '>';
	}
	
	
	$imgStr = '<img
   src="'.$imageFile.'"
   alt="'.$altText.'"
   '.$size.'
  />';
	
	if (!empty($linkText)) {
 $imgStr = $linkText . $imgStr . '</a>';
	}	

	return '<div style="width:'.($X).'px; height:'.($Y).'px;"><div class="shadowWrap1" style="width:'.$X.'px; height:'.$Y.'px;"><div class="shadowWrap2"><div class="shadowWrap3">'.$imgStr.'</div></div></div></div>';
}