Vorheriges Thema anzeigen: Nächstes Thema anzeigen: |
 Verfasst am: Fr Okt 17, 2003 22:15 Titel: javascript - rollover bei thumbnails (fade.js)
| Autor |
Nachricht |
kontur

Anmeldedatum: 16.01.2003 Beiträge: 246 Wohnort: passau
|
Verfasst am: Fr Okt 17, 2003 22:15 Titel: javascript - rollover bei thumbnails (fade.js) |
|
|
jo
versuch mir nun javascript bissle beizubringen, und mir schwebt da sowas im kopf, hab des schonmal auf irgendwelchen seiten gesehen:
sind so thumbnail-vorschauen, und bei mouseover werden die z.b. heller, die thumbnails, also etwas 'weis-durchsichtig' überzogen.
wie macht man das? über zwei einzelne thumbnails, einen hell, einen dunkel? oder gibt's da ne eigenschaft, mit der man %alpha, wie in flash, bei nem bild festlegen kann?
ein link zu nem solchen script is zwar auch hilfreich weil ich's mir rauslesen kann, aber da ich's eher verstehen möcht wären auch bloß tips schon super
k. |
|
| Nach oben |
|
 Verfasst am: Sa Okt 18, 2003 00:48 Titel:
| Autor |
Nachricht |
Xdreamer Special Honouring Member

Anmeldedatum: 07.08.2002 Beiträge: 1234 Wohnort: nahe bei dir
|
Verfasst am: Sa Okt 18, 2003 00:48 Titel: |
|
|
| Zitat: |
wie macht man das? über zwei einzelne thumbnails, einen hell, einen dunkel? oder gibt's da ne eigenschaft, mit der man %alpha, wie in flash, bei nem bild festlegen kann?
|
jep genau das fading script hab ich hier irgendwo noch rumliegen |
|
| Nach oben |
|
 Verfasst am: Sa Okt 18, 2003 12:48 Titel:
| Autor |
Nachricht |
ade Special Mosher

Anmeldedatum: 05.03.2003 Beiträge: 1421 Wohnort: Schweiz
|
Verfasst am: Sa Okt 18, 2003 12:48 Titel: |
|
|
bitte nur implementieren wenns umbedingt notwendig ist...
die dinger sind absolut unnötig, nervtötend und eine absolute verschwendung von transfervolumen.
ich bin absolut allergisch auf die dinger! |
|
| Nach oben |
|
 Verfasst am: Sa Okt 18, 2003 15:12 Titel:
| Autor |
Nachricht |
kontur

Anmeldedatum: 16.01.2003 Beiträge: 246 Wohnort: passau
|
Verfasst am: Sa Okt 18, 2003 15:12 Titel: |
|
|
ui, wär fein wenn du mal schicken/posten könntest damit ich mir das angucken kann, wie man sowas bewerkstelligt
naja, ich find's ansprechend, wenn man sieht wo man grad mit der maus rumschwirrt...zudem will ich's mal ausprobieren, wenn's mir net gefällt bleibt's draußen..
zudem is des sicher gut zur erweiterung meiner js kenntnisse *hrhr*
k. |
|
| Nach oben |
|
 Verfasst am: Sa Okt 18, 2003 19:40 Titel:
| Autor |
Nachricht |
Xdreamer Special Honouring Member

Anmeldedatum: 07.08.2002 Beiträge: 1234 Wohnort: nahe bei dir
|
Verfasst am: Sa Okt 18, 2003 19:40 Titel: |
|
|
folgender code steht in der fade.js
| Code: |
<!-- FOR FADING -->
<script language="JavaScript" type="text/javascript">
nereidFadeObjects = new Object();
nereidFadeTimers = new Object();
function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){
setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}
clearTimeout(nereidFadeTimers[object.sourceIndex]);
diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;
if (object.filters.alpha.opacity != destOp){
nereidFadeObjects[object.sourceIndex]=object;
nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFa
deObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
}
}
</script>
<!-- /FOR FADING -->
|
so zum einbinden
| Code: |
<script src="fade.js" language="Javascript"></script>
|
und darunter noch folgendes
| Code: |
<script>
/*
Gradual-Highlight Image Script II-
By J. Mark Birenbaum (birenbau@ugrad.cs.ualberta.ca)
Permission granted to Dynamicdrive.com to feature script in archive
For full source to script, visit http://dynamicdrive.com
*/
nereidFadeObjects = new Object();
nereidFadeTimers = new Object();
/* object - image to be faded (actual object, not name);
* destop - destination transparency level (ie 80, for mostly solid)
* rate - time in milliseconds between trasparency changes (best under 100)
* delta - amount of change each time (ie 5, for 5% change in transparency)
*/
function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){ //do this so I can take a string too
setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}
clearTimeout(nereidFadeTimers[object.sourceIndex]);
diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;
if (object.filters.alpha.opacity != destOp){
nereidFadeObjects[object.sourceIndex]=object;
nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
}
}
</script>
|
|
|
| Nach oben |
|
 Verfasst am: So Okt 19, 2003 12:22 Titel:
| Autor |
Nachricht |
kontur

Anmeldedatum: 16.01.2003 Beiträge: 246 Wohnort: passau
|
Verfasst am: So Okt 19, 2003 12:22 Titel: |
|
|
vielen dank
k. |
|
| Nach oben |
|
|
|