"Tausende Sterne, die sich in einem Volumen von nur einem Lichtjahr drängen" Zitat
mat
Wie Sterne drängen wir uns in der undefinierbaren Masse der gedanklichen Sphären

Sternenfeld überlappungsfrei und trotzdem random

September 17th, 2009 by infin

PHP Code:


// setting up variables
$xmax = 660;
$ymax = 160;
$stepsize = 60;
$stars = array();
$field = array();

// setting up object
class star {
public $url;
public $position;
public function __construct($url) {
$this->url = 'http://' . $url . '/';
$this->position['x'] = rand(0,32);
$this->position['y'] = rand(0,32);
}
}

// settup field array
for ($nx = 16; $nx < $xmax; $nx = $nx + $stepsize) {
for ($ny = 16; $ny $nx,'y' => $ny);
$field[] = array('x' => $nx,'y' => $ny);
}
}

// setup stars array
$blog_list = get_blog_list( 0, count($field));
foreach ($blog_list AS $blog) {
$star = new star($blog['domain']);
$stars[] = $star;
}

// randomise fields
shuffle($field);

// randomise stars
shuffle($stars);

// build up the random not overlapping starfield
$i = 0;
foreach ($stars as $star) {
$posx = $field[$i]['x'] + $star->position['x'];
$posy = $field[$i]['y'] + $star->position['y'];
echo '

';
$i++;
}

CSS


#sternteil {
display:block;
position:relative;
z-index:2;
width:712px;
height:216px;
background-image:url(Chandra-originalcopy.jpg);
margin:0px;
padding:0px;
}
div.stern {
position:absolute;
z-index:3;
width:60px;
height:61px;
background-image:url(stern0.png);
}
div.stern a {
display:none;
position:absolute;
top:0px;
left:0px;
text-align:center;
width:64px;
height:64px;
line-height:136px;
color:#ffff00;
font-size:0.9em;
text-decoration:none;
font-weight:bolder;
text-indent:-40px;
}

div.stern:hover a {
display:block;
}

div.stern:hover {
background-image:url(stern1.png);

}