Захотелось немного поэкспериментировать с рыбоглазом. Но что-то он тупит, точнее я. Проблема в том, что вторая группа кнопок почему-то не правильно реагирует на курсор.
Легче показать чем объяснить(поместите курсор в самый верх страницы)
http://wowwnet.x10hosting.com/phpbb3...f=5&t=6&p=7#p7
Код:
<div id=calc_frm style="position:absolute;z-index:99;height:300px; width:300px;">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="dojo/dojo.js"></script>
<script type="text/javascript">
dojo.require("dojox.widget.FisheyeList");
dojo.require("dojo.parser");
dojo.addOnLoad(function () {
dojo.parser.parse();
});
</script>
<style>
body, div, dl, dt, dd, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
margin: 0;
padding: 0;
}
fieldset, img {
border: 0 none;
}
address, caption, cite, code, dfn, th, var {
font-style: normal;
font-weight: normal;
}
caption, th {
text-align: left;
}
q:before, q:after {
content:"";
}
abbr, acronym {
border:0;
}
body {
font: 12px Myriad,Helvetica,Tahoma,Arial,clean,sans-serif;
*font-size: 75%;
}
h1 {
font-size: 1.5em;
font-weight: normal;
line-height: 1em;
margin-top: 1em;
margin-bottom:0;
}
h2 {
font-size: 1.1667em;
font-weight: bold;
line-height: 1.286em;
margin-top: 1.929em;
margin-bottom:0.643em;
}
h3, h4, h5, h6 {
font-size: 1em;
font-weight: bold;
line-height: 1.5em;
margin-top: 1.5em;
margin-bottom: 0;
}
p {
font-size: 1em;
margin-top: 1.5em;
margin-bottom: 1.5em;
line-height: 1.5em;
}
blockquote {
font-size: 0.916em;
margin-top: 3.272em;
margin-bottom: 3.272em;
line-height: 1.636em;
padding: 1.636em;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
ol li, ul li {
font-size: 1em;
line-height: 1.5em;
margin: 0;
}
pre, code {
font-size:115%;
*font-size:100%;
font-family: Courier, "Courier New";
background-color: #efefef;
border: 1px solid #ccc;
}
pre {
border-width: 1px 0;
padding: 1.5em;
}
table { font-size:100%; }
table.dojoTabular {
border-collapse: collapse;
border-spacing: 0;
border: 1px solid #ccc;
margin: 0 1.5em;
}
.dojoTabular th {
text-align: center;
font-weight: bold;
}
table.dojoTabular thead, table.dojoTabular tfoot {
background-color: #efefef;
border: 1px solid #ccc;
border-width: 1px 0;
}
table.dojoTabular thead tr th,
table.dojoTabular thead tr td,
table.dojoTabular tbody tr td,
table.dojoTabular tfoot tr td {
padding: 0.25em 0.5em;
}
.dojoxFisheyeListItemLabel {
font-family: Arial, Helvetica, sans-serif;
background-color: #eee;
border: 2px solid #666;
padding: 2px;
text-align: center;
position: absolute;
display: none;
white-space:pre;
}
.dojoxFisheyeListItemLabel.dojoxFishSelected {
display: block;
}
.dojoxFisheyeListItemImage {
border: 0px;
position: absolute;
}
.dojoxFisheyeListItem {
position: absolute;
z-index: 99999;
}
.dojoxFisheyeListBar {
position: relative;
}
.dojoxFisheyeListBar {
margin: 0 auto;
text-align: center;
}
.outerbar {
background-color: #666;
text-align: center;
position: absolute;
left: 0px;
top: 0px;
width: 100%;
border-bottom:2px solid #333;
}
body {
font-family: Arial, Helvetica, sans-serif;
padding: 0;
margin: 0;
background-color:#fff;
background-image:none;
}
.page {
padding: 50px 20px 20px 20px;
}
</style>
<script language="javascript">
var calc_db;
var calc_class;
function redirect(_root, _db, _class) {
window.location.href = _root + '/' + _db + '/' + 'talents.html?ru&' + _class;
};
$(document).ready(function(){
$('#fisheye2').hide();
}
);
</script>
<div dojoType="dojox.widget.FisheyeList"
itemWidth="100" itemHeight="50"
itemMaxWidth="200" itemMaxHeight="100"
orientation="horizontal"
effectUnits="2"
itemPadding="10"
attachEdge="top"
labelEdge="bottom"
id="fisheye1"
>
<div dojoType="dojox.widget.FisheyeListItem"
id="wnet"
onclick="calc_db = $(this).attr('id');$('#fisheye1').fadeOut('slow', function(){$('#fisheye2').fadeIn('slow');});"
label="База талантов www.wow.wnet.ua"
iconSrc="calcimg/wow.wnet.png">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="blizzard"
label="официальная база талантов"
iconSrc="calcimg/blizzard.png"
onclick="calc_db = $(this).attr('id');$('#fisheye1').fadeOut('slow', function(){$('#fisheye2').fadeIn('slow');});"
</div>
</div>
<div dojoType="dojox.widget.FisheyeList"
itemWidth="100" itemHeight="100"
itemMaxWidth="200" itemMaxHeight="200"
orientation="horizontal"
effectUnits="3"
itemPadding="25"
attachEdge="top"
labelEdge="bottom"
id="fisheye2"
>
<div dojoType="dojox.widget.FisheyeListItem"
id="druid"
onclick="calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);"
label=""
iconSrc="calcimg/class_druid.jpg">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="hunter"
label=""
iconSrc="calcimg/class_hunter.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="mage"
label=""
iconSrc="calcimg/class_mage.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="paladin"
label=""
iconSrc="calcimg/class_paladin.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="priest"
label=""
iconSrc="calcimg/class_priest.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="rogue"
label=""
iconSrc="calcimg/class_rogue.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="shaman"
label=""
iconSrc="calcimg/class_shaman.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="warlock"
label=""
iconSrc="calcimg/class_warlock.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="warrior"
label=""
iconSrc="calcimg/class_warrior.jpg"
onclick= "calc_class = $(this).attr('id');redirect('http://wowwnet.x10hosting.com/phpbb305ru' , calc_db , calc_class);">
</div>
</div>
</div>
Есть идеи ?
