Dostosowanie modułu- Podświetlenie

[maniek90]

Witam.

Czy jest dostępny jakiś moduł, w którym można uzyskać taki efekt jak na tej stronie (po prawej: NAJNOWSZE)
http://www.widelec.pl/widelec/1,99760,8172494,Laska_dnia__Yang_Qihan_aka_Isabell a.html

Chodzi mi o podświetlenie i zmienne tło kolejnych pozycji.


Próbowałem w AIDANEWS uzyskać taki efekt przez przyrostek stylów, ale, albo nie umiałem, albo się nie da.

[a_m]

pseudoklasa hover; moduł dowolny; a taki efekt jest wbudowany w style np tego (http://tools.gavick.com/demo/news-show-pro-gk1) modułu

[maniek90]

Właśnie znam tą pseudoklasę i właśnie z nią próbowałem


div.wlasny_modul3 {
background: #000;
font-color: #fff;
}




div.wlasny_modul3 div:hover {
background: #656565;
font-color: #fff;
}


div.wlasny_modul3 div {
font: 11px Arial;
color: #CCCCCC;
}



Tylko po najechaniu na jeden element podświetlają się wszystkie ;(

[a_m]

nie wiem jakiego modułu używasz; podświetl kontener pojedynczego elementu; masz link do strony?

dla aidy - np .aidanews div:hover{ background: #000}

[maniek90]

działa, ale jest 1 problem, za chwile pokaze


Nigdy bym sam nie doszedł że to tak ma być żeby podświetlało. Podświetla SUUPER :) dzięki

Tylko jeszcze taki szkopuł, hmm czego ucina kawałek dołu:

http://tinypic.pl/438rxsp1rqsx

masz jakiś pomysł może?


EDIT:

OK, już sobie w miare z tym obcietym dolem poradzilem.

1. A masz może pomysł jak zrobić aby kontenery miały na zmiane inny odcien koloru

[a_m]

użyj standardowego modułu K2 - k2 content on generuje "przemienne" klasy even i odd

[maniek90]

OK, dzięki serdeczne :)

A czy da się zrobić, żeby po najechaniu myszą cały ten podświetlony kontener był klikalny (jako link do artykułu)

[a_m]

bez modyfikacji modułu, raczej nie

[KejeN]

Witam,
Włączam się do dyskusji.
Klikalność diva możesz uzyskać automatycznie z użyciem kodu napisanego dla biblioteki jQuery.
Pisze o tym Nasz kolega z forum na swoim blogu (http://blog.piotrnalepa.pl/2010/03/05/jquery-10-ciekawych-trickow-ktore-warto-znac/) (trick nr 7). Jednak musisz do tego mieć załadowaną bibliotekę jQuery co skutkuje większym ciężarem witryny i może konfliktować z domyślnym mootools-em - w takim wypadku trick nr 10 z tego samego artykułu.
Pozdrawiam.

[a_m]

no i wszystko jasne, dzięki @KejeN za link

[maniek90]

Dzieki, ale możecie mi wskazać, jak mam ściągnąć jquery i gdzie go umiejscowić.

I gdzie mam wkleic ten kod: div klikalny:


$(document).ready(function() {
$("div").click(function(){
//pobieranie adresu z atrybutu href danego linka
window.location=$(this).find("a").attr("href"); return false;
});
});

Bo nei bardzo sie orientuje jak to zrobic;/

[KejeN]

jQuery pobierzesz ze strony jquery.com (http://docs.jquery.com/Downloading_jQuery) .
Skrypty wstawiasz w sekcji head w znaczniku script:

<script language="javascript" type="text/javascript" src="ścieżka do pliku"></script>
Drugiego kodu moim zdaniem nie opłaca się zapisywać do pliku możesz wpisać go bezpośrednio do szablonu w sekcji head o tak:


<script type="text/javascript">
$(document).ready(function() {
$("div").click(function(){
//pobieranie adresu z atrybutu href danego linka
window.location=$(this).find("a").attr("href"); return false;
});
});
</script>

Kod jest w przykładowej postaci oczywiście musisz określić na które elementy ma działać w przeciwnym wypadku wszystkie div-y, w których są odnośniki będą klikalne.
Zrobisz to wpisując w linijce:

$("div").click(function(){
np.

$("div.twoja-klasa-div-a").click(function(){
Pozdrawiam.

[maniek90]

To mam zapisać jako plik?
http://code.jquery.com/jquery-1.4.2.min.js


1. gdzie mam ten plik jquery wsadzić?
2. skrypty wstawiam w sekcji head, ale w jakim pliku?


przepraszam, ale jestem ciemna masa;/

[KejeN]

Tak to masz zapisać jako plik. Nazwa dowolna rozszerzenie .js
Ad.1 Plik możesz wsadzić gdziekolwiek przykładowo do katalogu 'js' (o ile taki jest) w katalogu Twojego szablonu. Ważne żeby wpisana ścieżka była dokładna, bo sam plik może leżeć nawet na innym serwerze :)
Ad. 2 Do sekcji head w pliku index.php Twojego szablonu (/templates/katalog-szablonu/index.php)

[KejeN]

@maniek90:
Jest jeszcze inna droga, bo jeśli nie używasz biblioteki jQuery na swojej stronie to nie rozsądne jest ładowanie jej dla wykorzystywania do wykonania jednego 'kilku-linijkowego' skryptu.
Mianowicie css:
ustawienie wymiarów linku 'czytaj dalej' tak by zakrywał cały kontener z newsem i z-index tak by ten link był na wierzchu, a dla kontenera z newsem overflow:hidden; by przypadkiem link nie wyjeżdżał poza jego granice.

Zaproponowałem Ci jednak użycie jQuery, bo ciężko mi określić, które rozwiązanie będzie dla Ciebie prostsze do zrealizowania.
PS: Dobrą manierą jest napisanie "już mi działa" lub "dalej tego nie ogarniam" ,bo nie wiadomo czy poradziłeś sobie z tym.

[maniek90]

Sory, zapomniałem o tym temacie i chwiliowo przestałem bawić sie joomlą.

Więc tak: próbowałem zrobić za pomocą jQuery, zrobiłem wszystko jak napisałeś. Niestety div nie byl klikalny.

Zrezygnowałem z podświetlanego kontenera, bez podświetlania jednak moim zadaniem bedzie lepiej. dzieki za pomoc