Tag Archive for image

image watermark with php

<?php

$main_img 		= "image.jpg"; // main big photo / picture
$watermark_img	= "watermark.gif"; // use GIF or PNG, JPEG has no tranparency support
$padding 		= 3; // distance to border in pixels for watermark image
$opacity		= 100;	// image opacity for transparent watermark

$watermark 	= imagecreatefromgif($watermark_img); // create watermark
$image 		= imagecreatefromjpeg($main_img); // create main graphic

if(!$image || !$watermark) die("Error: main image or watermark could not be loaded!");

$watermark_size 	= getimagesize($watermark_img);
$watermark_width 	= $watermark_size[0];
$watermark_height 	= $watermark_size[1];

$image_size 	= getimagesize($main_img);
$dest_x 		= $image_size[0] - $watermark_width - $padding;
$dest_y 		= $image_size[1] - $watermark_height - $padding;

// copy watermark on main image
imagecopymerge($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height, $opacity);

// print image to screen
header("content-type: image/jpeg");
imagejpeg($image);
imagedestroy($image);
imagedestroy($watermark);

source

List all images from Directory (and sub-directory)

<?php
//path to directory to scan. i have included a wildcard for a subdirectory
$directory = "images/*/";

//get all image files with a .jpg extension.
$images = glob("" . $directory . "*.jpg");

$imgs = '';
// create array
foreach($images as $image){ $imgs[] = "$image"; }

//shuffle array
shuffle($imgs);

//select first 20 images in randomized array
$imgs = array_slice($imgs, 0, 20);

//display images
foreach ($imgs as $img) {
echo "<img src='$img' /> ";
}
?>

source

Image Cache Preset manuell im Template verwenden

theme('imagecache', Imagecache-Preset, filepath,title,alt);

source

Fixed Background Image ‘Trick’

<style type="text/css">
body { padding:0; margin:0; background:#fff; }
.content {
padding:10px 20px 10px 200px;
border-bottom:1px solid #666;
background-color: trasnsparent;
background-repeat: no-repeat;
background-position: 20px 20px;
background-attachment: fixed;
}
.green {
background-image: url(images/circle_green.gif);
}
.yellow {
background-image: url(images/circle_yellow.gif);
}
.red {
background-image: url(images/circle_red.gif);
}
.purple {
background-image: url(images/circle_purple.gif);
}
.blue {
background-image: url(images/circle_blue.gif);
}
.content p {
font:normal 12px/18px verdana;
color:#000;
}
</style>
</head>
<body>

<div class="content green">
</div>

<div class="content blue">
</div>

<div class="content yellow">
</div>

<div class="content purple">
</div>

<div class="content red">
</div>

source

Add a custom image rotator

function custom_image_rotator() {
echo '<div class="image_box">';
$rotator_dir = opendir(THESIS_ROTATOR);
while (($file = readdir($rotator_dir)) !== false) {
$haystack = strtolower($file);
if (strpos($haystack, '.jpg') || strpos($haystack, '.jpeg') || strpos($haystack, '.png') || strpos($haystack, '.gif'))  {
$images[$file]['url'] = THESIS_ROTATOR_FOLDER . '/' . $file;
$image_path = THESIS_ROTATOR . '/' . $file;
$image_size = getimagesize($image_path);
$images[$file]['width'] = $image_size[0];
$images[$file]['height'] = $image_size[1];

if (thesis_get_image_size_class($image_size[0], $image_size[1]))
$images[$file]['class'] = 'class="' . thesis_get_image_size_class($image_size[0], $image_size[1]) . '" ';
}
}

if ($images)
$random_image = array_rand($images);
$image_alt_tags = thesis_get_option('image_alt_tags');
$image_link_urls = thesis_get_option('image_link_urls');

if ($image_alt_tags[$random_image])
$images[$random_image]['alt'] = $image_alt_tags[$random_image];
else
$images[$random_image]['alt'] = $random_image;

$img = '<img ' . $images[$random_image]['class'] . 'src="' . $images[$random_image]['url'] . '" alt="' . $images[$random_image]['alt'] . '" />';

if ($image_link_urls[$random_image]) {
$link_before = '<a href="' . $image_link_urls[$random_image] . '">';
$link_after = '</a>' . "
";
}
else
$img .= "
";

echo $link_before . $img . $link_after . '</div>';
}
add_action('thesis_hook_after_multimedia_box', 'custom_image_rotator');

source

CSS3 border image properties

border: 5px solid #cccccc;
-webkit-border-image: url(/images/border-image.png) 5 repeat;
-moz-border-image: url(/images/border-image.png) 5 repeat;
border-image: url(/images/border-image.png) 5 repeat;

border-bottom-right-image:
border-bottom-image:
border-bottom-left-image:
border-left-image:
border-top-left-image:
border-top-image:
border-top-right-image:
border-right-image:

source

IE6 Image Flicker

html {
filter: expression(document.execCommand("BackgroundImageCache", false, true));
}

source

wordpress – automatically create Greybox imageset from images attached to post

<!--Automatic Greybox-->
<?php
//Die zum Post gehoerenden Bilder ins Array $images schreiben
//Put images from post in to array $images. Order by menu order defined in post gallery
$images = get_children( array('post_parent' => $post->ID, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'ASC', 'orderby' => 'menu_order ID') );

//Pruefen, ob dem Beitrag Bilder angehaengt wurden.
//check if there are any images attached to the post
if (isset($images))
{
//Den Zaehler auf 0 setzen
//set counter to 0
$count=0;
//Alle Bilder im Array $images nacheinander durchlaufen
//go through all images in array $images
foreach( $images as $image )
{
$imageID = $image->ID;
//fuer jedes Bild im Array die URL von sowohl der Mittleren, als auch der grossen Groesse ermitteln.
//get medium and large image url for image
$medImageSrc = wp_get_attachment_image_src($imageID, $size='medium', $icon = false);
$largeImageSrc = wp_get_attachment_image_src($imageID, $size='large', $icon = false);

//Wenn es sich um das erste Bild im Array handelt...
//If it's the first image in the array
if ($count==0)
{
//Den Greybox-Code mit einem Vorschaubild ausgeben
//output Greybox Code with medium size preview
echo"<a href='$largeImageSrc[0]' rel='shadowbox[Bilder]'><img src='$medImageSrc[0]' border='0'></a>";
}
//alle Bilder ,die nach dem erstern Bild kommen
//this is for all the images that come after the first one
else
{
//unsichtbare Greybox-Verknuepfung darstellen.
//create invisible Greybox-Links without preview image
echo"<a href='$largeImageSrc[0]' rel='shadowbox[Bilder]'></a>";
}
//Zaehler erhoehen.
//increase counter
$count++;

} //foreach
}

?>

<!--ENDE Automatic Greybox -->

source

Has the image loaded?

$("img").each(function(){
i = $(this).attr('src');
$(this).attr('src','')
$(this).load(function(){
$(this).data('loaded','true');
});
$(this).attr('src',i);
});

source

Enlace con imagen

a {
background:transparent url(../images/button_register.png) no-repeat scroll 0 0;
height:24px;
overflow:hidden;
position:absolute;
right:145px;
text-indent:-9999px;
top:174px;
width:151px;
}

source