Jak w metodzie Fold.activate() mam pobrać styl :hover elementu <li> i przypisać go?
style.cssbody { background:rgb(255,153,51); }
div#wrapper { width:90%; height:100px; margin:0 auto; background:rgb(255,204,0); }
ul#menu { width:100%; list-style:none; background:white; }
ul#menu li { float:left; padding:0 2em; }
ul#menu li#link_1, ul#menu li#link_2, ul#menu li#link_3 { cursor:pointer; }
ul#menu li#link_1 { background:rgb(255,80,80); }
ul#menu li#link_2 { background:rgb(125,255,0); }
ul#menu li#link_3 { background:rgb(0,125,190); }
ul#menu li#link_1:hover, div#panels div#item_1 { background:rgb(255,100,100); }
ul#menu li#link_2:hover, div#panels div#item_2 { background:rgb(165,255,40); }
ul#menu li#link_3:hover, div#panels div#item_3 { background:rgb(20,145,190); }
div#panels { width:100%; }
div#panels div { width:100%; display:none; }
index.htm<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="style/style.css" media="all" /> <script type="text/javascript" src="script/jquery-1.2.6.js"></script> <script type="text/javascript" src="script/menu.js"></script> <li id="link_1">Pełne
</li> <li id="link_2">Zakres
</li> <li id="link_3">Filtry
</li>
menu.js( To jest javascript ale użyłem tagu PHP bo inne rozwalają wcięcia kodzie. )
<?php
function Fold_Collection($default)
{
this
.folds
= new Array(); this.default_ = $default;
var ths = this;
this.append = function($fold)
{
this.folds[this.folds.length] = $fold;
}
this.load = function()
{
var $links = $("ul#menu");
var $panels = $("div#panels");
{
$fold = new Fold($($links.get($i)), $($panels.get($i)), ths);
$fold.setEvtClick();
ths.append($fold);
});
}
this.deactivate = function()
{
for(var $i = 0; $i < this.folds.length; $i++)
{
this.folds[$i].deactivate();
}
}
this.init = function()
{
$("document").ready(
function()
{
ths.load();
});
}
}
function Fold($anch, $fold, $parent)
{
this.anch_ = $anch;
this.fold_ = $fold;
this.parent_ = $parent;
this.setEvtClick = function()
{
this.anch_.click(
function()
{
this.parent_.deactivate();
this.activate();
});
}
this.activate = function()
{
}
this.deactivate = function()
{
}
}
$folds = new Fold_Collection(0);
$folds.init();
?>
Poradziłem sobie reorganizując style i dodając jedną klasę z takimi samymi ustawieniami jak :hover. Pobrać stylów dla :hover niestety nie zdołałem.
ul#menu { width:100%; list-style:none; background:white; }
ul#menu li { float:left; padding:0 2em; }
li#link_1, li#link_2, li#link_3 { cursor:pointer; }
li#link_1, div#item_1 { background:rgb(255,80,80); }
li#link_2, div#item_2 { background:rgb(25,255,80); }
li#link_3, div#item_3 { background:rgb(20,145,190); }
li.link_active, li#link_1:hover, li#link_2:hover, li#link_3:hover
{ /*filter:alpha(opacity=100);*/ -moz-opacity:1; -khtml-opacity:1; /*opacity:1;*/ }
li.link_inactive { /*filter:alpha(opacity=70);*/ -moz-opacity:0.7; -khtml-opacity:0.7; /*opacity:0.7;*/ }
<li id="link_1" class="link_inactive">Zakres
</li> <li id="link_2" class="link_inactive">Filtry
</li> <li id="link_3" class="link_inactive">Aktulizacja
</li> <div id="item_1" class="item_inactive"> (...)
Ten post edytował orglee 15.02.2009, 12:55:01
[jQuery] Użycie styli zdefiniowanych w pliku CSS, Żeby został :hover po klikniąciu myszką
orglee [jQuery] Użycie styli zdefiniowanych w pliku CSS 18.02.2009, 19:54:20 
