Fajny dymek po najechaniu na link
|
zszywak |
Dodany dnia 03.12.2004 22:42:05
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
NIe wiem czy komus się to przyda, ale jest efektowne.
1. tworzycie plik gpe.js i wrzucacie go do katalogu fusion_core, oto zawartość pliku:
/*
Graculini's Popup Engine - GPE v1.0
Copyright© Gracjan Lech 2003.
Contact me:
This notice must remain untouched at all times.
*/
function displayConfig() {
//KONFIGURACJA START
//Odstęp popup'a od kursora w poziomie
if ((popupOffsetX=getValue("popupOffsetX"))==NA)
popupOffsetX=10
//Odstęp popup'a od kursora w pionie
if ((popupOffsetY=getValue("popupOffsetY"))==NA)
popupOffsetY=10
//Położenie popup'a względem myszki
if ((popupAlign=getValue("popupAlign"))==NA)
popupAlign="right" //Inne opcje - left, center
//Długość popup'a
if ((popupWidth=getValue("popupWidth"))==NA)
popupWidth=160
//Szerokość obramowania całego popup'a
if ((popupBorderWidth=getValue("popupBorderWidth"))==NA)
popupBorderWidth="1px"
//Kolor obramowania popup'a
if ((popupBorderColor=getValue("popupBorderColor"))==NA)
popupBorderColor="#333399"
//Styl obramowania popup'a (dotted, double...)
if ((popupBorderStyle=getValue("popupBorderStyle"))==NA)
popupBorderStyle="solid"
//Domyślna przeźroczystość popup'a
if ((popupOpacity=getValue("popupOpacity"))==NA)
popupOpacity=100
//Kolor czcionki nagłówka
if ((captionColor=getValue("captionColor"))==NA)
captionColor="#ffffff"
//Styl czcionki nagłówka
if ((captionFontStyle=getValue("captionFontStyle"))==NA)
captionFontStyle="normal"
//Pogrubienie czcionki nagłówka
if ((captionFontWeight=getValue("captionFontWeight"))==NA)
captionFontWeight="bold"
//Wielkość czcionki nagłówka
if ((captionFontSize=getValue("captionFontSize"))==NA)
captionFontSize="9px"
//Czcionka nagłówka
if ((captionFontFamily=getValue("captionFontFamily"))==NA)
captionFontFamily="Verdana, sans-serif"
//Wypełnienie ogólne
if ((captionPadding=getValue("captionPadding"))==NA)
captionPadding="0px";
//Kolor tła nagłówka
if ((captionBackgroundColor=getValue("captionBackgroundColor"))==NA)
captionBackgroundColor=popupBorderColor
//Tło nagłówka
if ((captionBackgroundImage=getValue("captionBackgroundImage"))==NA)
captionBackgroundImage=""
//Dodatki do tła
if ((captionBackgroundImageProperties=getValue("captionBackgroundImageProperties"))==NA)
captionBackgroundImageProperties=""
//Kolor czcionki tekstu
if ((textColor=getValue("textColor"))==NA)
textColor="#000000"
//Styl czcionki tekstu
if ((textFontStyle=getValue("textFontStyle"))==NA)
textFontStyle="normal"
//Pogrubienie czcionki tekstu
if ((textFontWeight=getValue("textFontWeight"))==NA)
textFontWeight="normal"
//Wielkość czcionki tekstu
if ((textFontSize=getValue("textFontSize"))==NA)
textFontSize="10px"
//Czcionka tekstu
if ((textFontFamily=getValue("textFontFamily"))==NA)
textFontFamily="Tahoma"
//Wypełnienie ogólne
if ((textPadding=getValue("textPadding"))==NA)
textPadding="2px";
//Kolor tła tekstu
if ((textBackgroundColor=getValue("textBackgroundColor"))==NA)
textBackgroundColor="#ccccff"
//Tło tekstu
if ((textBackgroundImage=getValue("textBackgroundImage"))==NA)
textBackgroundImage=""
//Dodatki do tła
if ((textBackgroundImageProperties=getValue("textBackgroundImageProperties"))==NA)
textBackgroundImageProperties=""
//fadeIn
if ((fadeIn=params.indexOf("fadeIn"))!=-1)
fadeIn=true
//Domyślny czas fadeIn
if (fadeIn && ((fadeInTime=getValue("fadeInTime"))==NA))
fadeInTime=1
//fadeOut
if ((fadeOut=params.indexOf("fadeOut"))!=-1)
fadeOut=true
//Domyślny czas fadeOut
if (fadeOut && ((fadeOutTime=getValue("fadeOutTime"))==NA))
fadeOutTime=1
//DODATKOWE SZATY
layout[1]="textBackgroundColor: #ffffe1; popupBorderColor: #000000; textFontFamily: verdana; textFontSize: 11px;"
layout[2]="textFontStyle: italic;"
//KONFIGURACJA KONIEC
}
document.write("<div id=\"popupDiv\" style=\"position: absolute; display: none; z-index: 1000; filter: alpha(opacity=100); -moz-opacity: 1;\">GPE v1.1 - popup engine</div>")
popup=document.getElementById("popupDiv")
OP=NS=IE=false
if (navigator.userAgent.indexOf("Opera")!=-1) OP=true
else if (navigator.appName=="Netscape") NS=true
else if (navigator.appName=="Microsoft Internet Explorer") IE=true
function gpe(arguments) {
fadingIn=false
fadeOut=false
params=arguments
layout=new Array()
captionClass=getValue("captionClass")
caption=getValue("caption")
textClass=getValue("textClass")
text=getValue("text")
popupLayout=getValue("popupLayout")
if (popupLayout!=null) params+=grabLay()
NA=null
displayConfig()
if (popupBorderColor==NA && captionBackgroundColor!=NA) popupBorderColor=captionBackgroundColor
po=eval(popupOpacity)
if (NS) NSpo=(po/100)
if (textBackgroundImage!=null) textBackgroundImage="url('"+textBackgroundImage+"') "+textBackgroundImageProperties+""
if (captionBackgroundImage!=null) captionBackgroundImage="url('"+captionBackgroundImage+"') "+captionBackgroundImageProperties+""
popupContent="<table cellpadding=0 cellspacing=0 style=\"width: "+popupWidth+"; border: "+popupBorderWidth+" "+popupBorderStyle+" "+popupBorderColor+";\">"
if (caption!=NA) {
popupContent+="<tr><td "
if (captionClass==null) popupContent+="style=\"color: "+captionColor+"; font: "+captionFontStyle+" "+captionFontWeight+" "+captionFontSize+" "+captionFontFamily+"; padding: "+captionPadding+"; background: "+captionBackgroundColor+" "+captionBackgroundImage+";\""
else popupContent+="class=\""+captionClass+"\""
popupContent+=">"+caption+"</td></tr>"
}
popupContent+="<tr><td "
if (textClass==null) popupContent+="style=\"color: "+textColor+"; font: "+textFontStyle+" "+textFontWeight+" "+textFontSize+" "+textFontFamily+"; padding: "+textPadding+"; background: "+textBackgroundColor+" "+textBackgroundImage+";\""
else popupContent+="class=\""+textClass+"\""
popupContent+=">"+text+"</td></tr></table>"
if (NS) {
content=document.createRange();
content.setStartBefore(popup);
content=content.createContextualFragment(popupContent);
with (popup) {
if (hasChildNodes()) removeChild(lastChild)
appendChild(content)
}
}
else popup.innerHTML=popupContent
pO(po)
if (IE) gpePos()
document.onmousemove=function gpePos(evt) {
if (NS) {
coordX=evt.pageX
coordY=evt.pageY
winWidth=innerWidth
}
else {
coordX=event.clientX+document.body.scrollLeft
coordY=event.clientY+document.body.scrollTop
winWidth=document.body.clientWidth
}
switch (popupAlign) {
case "left" :
if (coordX-popupWidth-popupOffsetX<0) coordX=popupWidth+popupOffsetX
coordX-=popupWidth+(popupOffsetX*2)
break
case "center" :
if (coordX+popupWidth/2>winWidth) {coordX=winWidth-popupWidth/2; popupOffsetX=0}
if (coordX-popupWidth/2<0) {coordX=popupWidth/2; popupOffsetX=0}
coordX-=popupWidth/2+popupOffsetX
break
case "right" :
if (coordX+popupWidth+popupOffsetX>winWidth) coordX=winWidth-popupWidth-popupOffsetX
}
popup.style.left=coordX+popupOffsetX
popup.style.top=coordY+popupOffsetY
}
popup.style.display="block"
if (fadeIn==true) {
pO(0)
fade(1)
}
popup.style.display="block"
document.onmouseout=function() {
if (fadeOut==true) {
if (fadeIn) fadeIn=false
else pO(po)
fade(2)
}
else popup.style.display="none"
}
}
function getValue(keyWord) {
with (params) {
if (indexOf(keyWord+":")==-1) return
keyInd=lastIndexOf(keyWord+":")
value=substring(keyInd+(keyWord.length+1),indexOf(";",keyInd))
}
while (value.indexOf("|:|")!=-1) {
with (value) {
value=substring(0,indexOf("|:|"))+";"+substring(indexOf("|:|")+3)
}
}
while (value.indexOf(" ")!=-1 && keyWord!="text" && keyWord!="caption") {
with (value) {
value=substring(0,indexOf(" "))+substring(indexOf(" ")+1)
}
}
if (keyWord=="popupOffsetX" || keyWord=="popupOffsetY" || keyWord=="popupWidth") {
value=eval(value)
}
return value
}
function grabLay() {
layParam=displayConfig+""
with (layParam) {
layParam=substring(indexOf("layout["+popupLayout+"]"),indexOf(";\"",indexOf("layout["+popupLayout+"]"))+1)
}
return layParam;
}
function fade(num) {
if (num==1 && fadeIn==true) {
if (pO()!=po) {
pO(2,"+")
fadingIn=setTimeout("fade(1)",fadeInTime)
}
else fadeIn=false
}
if (num==2 && fadeOut==true) {
if (pO()!=0) {
pO(2,"-")
fadingOut=setTimeout("fade(2)",fadeOutTime)
}
else {
fadeOut=false
if (NS==false && IE==false) popup.style.display="none"
}
}
}
function pO(oL,op) {
if (IE) {
with (popup.filters.alpha) {
if (oL==NA) return opacity
if (op==NA) opacity=oL
if (op=="+") {
if (opacity>=po) opacity=po
else opacity+=oL
}
if (op=="-") opacity-=oL
}
}
else if (NS) {
with (popup.style) {
if (oL==NA) return MozOpacity
else oL=(oL/100)
if (op==NA) MozOpacity=oL
if (op=="+") {
if (MozOpacity>=NSpo) MozOpacity=NSpo
else MozOpacity=parseFloat(MozOpacity)+oL
}
if (op=="-") MozOpacity=parseFloat(MozOpacity)-oL
}
}
else return false
}
2. w pliku subheader.php wstawiacie w sekcji HEAD:
<script type='text/javascript' src='".fusion_basedir."fusion_core/gpe.js'></script>
3. teraz wszędzie tam, gdzie macie jakieś linki (obojętnie czy to w panelach, w menu, buttonach itp, artykułach, linkach www itp) wstawiacie je według schematu:
[b]<a href=\"http://adres.twojej.strony/plik.php\" [u]onmouseover=\"gpe('text:tu wpisz tekst dymka;')\"[/u]>[/b]
albo:
[b]<a href="http://adres.twojej.strony/plik.php" [u]onmouseover="gpe('text:tu wpisz tekst dymka;')"[/u]>[/b]
4. mozna w dowolny sposób zmieniać wygląd dymka, trzeba tylko edytować plik gpe.js - mozna dowolnie zmieniać tło, wstawiać tagi html, itd. Bardzo efektowna rzecz!
Edytowane przez Pieka dnia 27.12.2008 00:36:40
|
|
|
|
Wścibski Gość |
Dodany dnia 27.04.2025 18:32:48
|
Pan Kontekstualny
Postów: n^x
Data rejestracji: Zawsze
|
|
IP: localhost |
|
|
Arox |
Dodany dnia 03.12.2004 23:18:09
|

Bywalec

Postów: 347
Data rejestracji: 16.07.2004 01:39
|
Dobra robota zszywak!
Jak sprawdzę tego MODa za kilka dni do wrzucę go do Download
oczywiście z opisem że to TWOJ moduł.
Dzięki
Jestem poza zasięgiem ...
|
|
|
|
zszywak |
Dodany dnia 04.12.2004 00:16:17
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
Dzieki Arox!
Ten CMS wciąga mnie coraz bardziej - to chyba uzależnienie
Nie dodałem jeszcze, że można dodawać tło w formie jakiegoś pliku np gif czy jpg, i że w ogóle - za pomocą tego skryptu można stworzyć coś w rodzaju niemal całej strony, w html oczywiście.
Bawiąc się tym skryptem zauważyłem, że toleruje większość tagów związanych z fontami i toleruje style.
Skrypt działa, chyba że ktoś coś pomiesza |
|
|
|
Shaolin |
Dodany dnia 05.12.2004 11:28:54
|

Bywalec

Postów: 888
Data rejestracji: 23.10.2004 14:59
|
Buuuu... Próbowałam wstawić ten dymek na swoją stronkę, ale coś nie działa... Jaka może być przyczyna?
Póbowałam zastosować ten efekt na linku do forum na mojej stronce www.shaolin.site.... (któryś news od góry, coś z forum w nazwie ) - jest tam link www.shaolin.site.... i link wstawiony jest tak, jak pisałes, ale nie wyświetla się żaden dymek 
Co zrobiłam nie tak? |
|
|
|
ostrowski |
Dodany dnia 05.12.2004 12:58:34
|

Przedszkolak

Postów: 2
Data rejestracji: 28.11.2004 18:22
|
Brawo Zszywak, super skrypt. Mam jednak pytanie. Jak dać ten dymek w główną nawigację? |
|
|
|
zszywak |
Dodany dnia 05.12.2004 15:20:16
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
jeśli chcecie zobaczyć czy ten skrypt działa to zerknijcie gryfpp.freelinuxh..., i wystarczy najechać np na główne logo u góry strony. możnaq edytować pliki w katalogu fusion_panels i tam gdzie jest jakiś a href="" wstawiać wyrażenie onmouseover, niestety, jesli chodzi o panel z nawigacją - najlepiej zrobić samemu menu w panelu, wtedy masz pełną kontrolę nad każdym linkiem. |
|
|
|
zszywak |
Dodany dnia 05.12.2004 15:32:14
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
Shaolin wrote:
Buuuu... Próbowałam wstawić ten dymek na swoją stronkę, ale coś nie działa...:( Jaka może być przyczyna?
Póbowałam zastosować ten efekt na linku do forum na mojej stronce www.shaolin.site.... (któryś news od góry, coś z forum w nazwie :D) - jest tam link www.shaolin.site.... i link wstawiony jest tak, jak pisałes, ale nie wyświetla się żaden dymek :o
Co zrobiłam nie tak?
Szczerze mówiąc Shaolin to nie wiem, co może być nie tak...., edytując menu belki nawigacyjne trzeba stosować zasadę: w pliku theme.php trzeba wstawić:
<a href='".fusion_basedir."fusion_forum/' onmouseover=\"gpe('text:tu wpisz tekst dymka można też z tagami html;')\">Forum</a>
jesli tak zrobiłaś, to na prawdę nie wiem co jest nie tak....
Może ktoś rozwiąże tą zagadkę? |
|
|
|
Shaolin |
Dodany dnia 05.12.2004 18:22:15
|

Bywalec

Postów: 888
Data rejestracji: 23.10.2004 14:59
|
No więc: wstawiłam do pliku theme.php ten kod, przekopiowałam na serwer, ale kiedy chciałam zobaczyć wyniki stronka się po prostu nie otwiera... Białe tło, na belce na dole napis "zakończono" - jest tak zawsze, kiedy coś pokręcę... Co tym razem może być źle? Bo już próbowałam na wszelkie sposoby, ale nie chce działać (cąłe szczęście że mam backupy theme.php ).
Jeszcze będę próbować, ale nie da się przeiwdzieć, co z tego wyniknie...
///dopisane później :
JUż wiem co może być przyczyną... Zszywak, czy ten skrypt współpracuje z v. 4.1...?
Edytowane przez Shaolin dnia 05.12.2004 18:24:11
|
|
|
|
zszywak |
Dodany dnia 05.12.2004 21:15:50
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
Shaolin - tak ten skrypt współpracuje z wersja 4.1, próbowałem z nim w obu wersjach i jest to niezależne od wersji, ten skrypt można praktycznie przystosować do każdego cms-a lub do zwykłych stron w html (przykład w html tutaj: www.assasin.repub...).
Może zrobimy tak: pokażę jak to wygląda na stronie, którą "obrabiam":
w pliku: subheader.php mam taki fragment (w wersji 4.1), znajdź linie z linkiem do skryptu gpe.js:
echo "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">
<html>
<head>
<title>".$settings['sitename']."</title>
<meta http-equiv='Content-Type' content='text/html; charset=".fusion_charset."'>
<meta name='description' content='".$settings['description']."'>
<meta name='keywords' content='".$settings['keywords']."'>
<link rel='stylesheet' href='".fusion_themedir."styles.css' type='text/css'>
<style type='text/css'>
<!--
.gallery { padding: 16px 0px 8px 0px; }
.gallery img { border: 1px solid #ccc; filter: gray; }
.gallery:hover img { border: 1px solid red; filter: none; }
img.activegallery { border: 1px solid green; filter: none; }
//-->
</style>
<script type='text/javascript' src='".fusion_basedir."fusion_core/gpe.js'></script>
<script type='text/javascript' src='".fusion_basedir."fusion_core/fusion.js'></script>
<script type='text/javascript' src='".fusion_basedir."fusion_panels/dzwiek.js'></script>
</head>
<body bgcolor='$body_bg' text='$body_text'>\n";
render_header("<img src='".fusion_basedir.$settings['sitebanner']."' alt='".$settings['sitename']."'>");
?>
jeśli tak to też wygląda u Ciebie to naprawdę nie wiem o co może chodzić... u mnie skrypt ten działa nie tylko na obu wersjach php fusion, ale też na innych cms-ach i na stronce w zwykłym html.
A w ogóle - czy przy kopiowaniu skryptu gpe.js z tej strony poprawiłaś błędnie napisane słowa javascript? zauważ, ze ten edytor, w którym właśnie piszemy na forum ma taki niefortunny błąd i trzeba to zawsze poprawiać
naprawdę nie wiem jak pomóc, może przytocz kod czy sposób w jaki umieszczasz ten skrypt? może wtedy jakoś to rozwiązemy.:)
ps. chciałem zarejestrować się na Twojej stronie, ale niestety coś jest nie tak - nie można, próbowałem 3 razy i niestety!
Edytowane przez zszywak dnia 05.12.2004 21:41:43
|
|
|
|
Shaolin |
Dodany dnia 06.12.2004 20:36:03
|

Bywalec

Postów: 888
Data rejestracji: 23.10.2004 14:59
|
Heh, nie zwróciłam uwagi na ten błąd w słowie java script - teraz wszystko ładnie działa . Dzięki.
BTW: Czy ktoś wie, czym może być spowodowany ten błąd pojawiający się przy rejestracji? Bo ja nie mam pojęcia . Nic (chyba) nie modyfikowałam w pliku rejestracji. Spróbuję to poprawić na własną rękę, ale nie wiem czy mi się uda, więc wszelka pomoc mile widziana... .
--dopisane
pojawia sie cos takiego: Column count doesn't match value count at row 1
Edytowane przez Shaolin dnia 06.12.2004 20:39:22
|
|
|
|
Shaolin |
Dodany dnia 07.12.2004 20:09:56
|

Bywalec

Postów: 888
Data rejestracji: 23.10.2004 14:59
|
Dobra, już naprawione, można się rejestrować . Miałam coś pokręconego z bazą danych, Digitanium pomógł mi to odkręcić . |
|
|
|
zszywak |
Dodany dnia 07.12.2004 22:11:07
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
zgadza się Shaolin - rejestracja przebiega bezproblemowo, jestem już userem na Twojej stronce |
|
|
|
Shaolin |
Dodany dnia 08.12.2004 08:46:20
|

Bywalec

Postów: 888
Data rejestracji: 23.10.2004 14:59
|
Thx Zszywak. Twoje dymki też już dobrze działają, spróbuję je wstawić do wszystkich linków i trochę edytować ten standardowy wygląd . Zobaczymy czy się uda. |
|
|
|
zszywak |
Dodany dnia 07.01.2005 00:40:32
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
Widzę, że ten pomysł na efektowne dymki jest chetnie czytany, może pochwalicie się efektami, jakie uzyskaliście na swoich stronach? Podajcie linki, chętnie odwiedzę i zobaczę!
|
|
|
|
zszywak |
Dodany dnia 07.01.2005 00:47:26
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
a gdyby ktos był zainteresowany, mogę podać sposób tworzenia efektownych linków z efektem typu "fade", niestety widoczny tylko dla IE, efekt mozna zobaczyć tutaj http://gryfpp.fre...uxhost.com, jesli ktoś jest zainteresowany, to dajcie znać.
|
|
|
|
Riklaunim |
Dodany dnia 08.01.2005 12:57:22
|

Początkujący

Postów: 244
Data rejestracji: 07.08.2004 10:53
|
zamiast bawić się jakimiś podrzędnymi IE only skryptami wystarczy trochę poszukać. Istnieje klasa PHP o nazwie overlib i służy do dynamicznego generowania tooltipów. Swego czasu używałem jej w Bibliotece by w tooltipie pokazywać treść newsa po najechaniu na jego tytuł (php fusion "enterprise" działa pod praktycznie wszystkimi przeglądarkami.
opis: http://www.cms.rk...e-134.html |
|
|
|
zszywak |
Dodany dnia 08.01.2005 16:24:27
|

Bywalec

Postów: 382
Data rejestracji: 09.11.2004 23:19
|
dzieki za info Riklaunim - zaraz zabieram sie do manuala php i podmienę skrypt z silnikiem gpe, ciekawe - czy efekt bedzie podobny?
|
|
|
|
piterus |
Dodany dnia 10.12.2006 16:51:07
|

Bywalec

Postów: 490 Pomógł: 33
v7.02.07 Data rejestracji: 19.12.2005 09:29
|
Hura... znalazłem to co mi potrzeba... Tylko jest jeden problem. Pod fusionem ten skrypt nie chce współpracować z IE 6 i Operą 9.02 ale zato działa z FF 2. Na moim kompie jak jest plik html to tylko nie działa z Operą. Jak to trzeba zrobić aby działało w stronach dodatkowych kiedy są zainkludowane z plików html?
//Edit
Zapomniałem podać adresik stronki, na której ten problemik występuje.
http://tawernatq....eczyki.php zobaczcie to pod FF i IE
//Edit2
Błądzić rzeczą ludzką tak więc znalazłem swój błąd. Polegał on na tym, że powyższy skrypt działa tylko z linkami, a ja próbowałem dać to z obrazkiem
Edytowane przez piterus dnia 10.12.2006 22:33:09
Piterus World mój blog i miejsce moich eksperymentów. Ubi lex, ibi poena Kontakt przez komunikatory tylko dla znajomych...
|
|
|
|
Morel_V |
Dodany dnia 29.08.2007 02:04:49
|

Przedszkolak

Postów: 22
Data rejestracji: 15.08.2007 20:12
|
Dobra mi też już działa...
Ale jak zrobić aby w tabelce weskiwało zdjęcie...??
Edytowane przez Morel_V dnia 29.08.2007 12:50:49
|
|
|
|
Gander |
Dodany dnia 29.08.2007 07:50:10
|

Bywalec

Postów: 720 Pomógł: 37
Data rejestracji: 22.05.2005 23:17
|
Przetestowałem to na kilku przeglądarkach.
Działa na:
Firefox 2.0.0.5
Internet Explorer 6
Flock 0.7.9.1
Mozilla 1.7.13
Netscape 8.1.2
Nie działa na:
Opera 9.02
GPE działa mi zarówno nad tekstem, obrazkami, linkami, komórkami tabeli, itd |
|
|