Очень красивое меню, реализованное при помощи Jquery, сравнимое только с меню реализованными на флеше.
Это меню работает за счет изменения background-position наложенных друг на друга слоями изображений.
User
< — NOTE: Не подключать в production -->
<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print">
<!--[if IE]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
bolk_data_uri_header(); bolk_data_uri('myjpeg.jpg'); bolk_data_uri('ourpng.png', 'border: 2px dotted red');
function bolk_data_uri_header() { echo "<!--\n" ."Content-Type: multipart/related; boundary=\"=_NextPart_01C6A9B1.539AB070\"\n\n" ."--=_NextPart_01C6A9B1.539AB070\n" ."Content-Transfer-Encoding: base64\n" ."Content-Type: text/html\n" ."-->\n\n"; } function bolk_data_uri($file, $style = '') { if (!( file_exists($file) && ($data = @getimagesize($file)) )) return false; $name = uniqid('', true); if ($style <> '') $style = ' style="'.htmlspecialchars($style).'"'; $mime = strpos($_SERVER['HTTP_USER_AGENT'], 'Gecko') ? " type='{$data['mime']}" : ''; echo "<!--\n" ."--=_NextPart_01C6A9B1.539AB070\n" ."Content-Location: {$name}\n" ."Content-Transfer-Encoding: base64\n" ."Content-Type: {$data['mime']}; -->\n" ."<object data='data:{$data['mime']};base64,\n\n"; echo base64_encode(file_get_contents($file)); echo "' {$data[3]}{$style}{$mime}'><img " ."src='mhtml:http://{$_SERVER['HTTP_HOST']}" ."{$_SERVER['REQUEST_URI']}!{$name}' {$data[3]}{$style} /></object>\n\n" ."<!--\n" ."--=_NextPart_01C6A9B1.539AB070-->"; return true; }