login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Probleem popup onmouseover script (Opgelost)

Offline Marc_Nijhuis - 13/10/2008 23:08 (laatste wijziging 14/10/2008 19:14)
Avatar van Marc_NijhuisNieuw lid Beste mensen,

Ik heb een probleem met een image popup onmouseover script in internet explorer.

Ik draai zo'n script op mijn website http://www.spelletjes-online.net die nog in de maak is. In Mozzila werkt het script helemaal goed, maar in internet explorer stuit ik op een probleem.

De bedoeling van het script is dat als je met je muis over een link gaat er een popup van een plaatje komt met een tekst. De popup van het plaatje moet net onder de cursor van de muis komen. Als ik op mijn eigen homepage helemaal naar boven scroll en met mijn muis over de eerste links ga werkt het nog allemaal prima. Zo gauw ik echter op mijn homepagina naar de beneden scroll en met mijn muis weer over een link scroll komt er wel het juiste plaatje met tekst in beeld, maar dit keer op een positie ver boven de cursor van de muis.

Dit is het script dat ik gebruik:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. verwijderd


Kan iemand mij hierbij helpen? Zodat het popup onmouseover plaatje altijd net onder de cursor van de muis te voorschijn komt en dus niet ver boven de cursor van de muis, zodra ik naar beneden scroll?

Alvast bedankt.

Groeten,

Marc Nijhuis

Citaat:
Rens edit:
Volgende keer code graag tussen code-tags.
Lappen code (zoals die van jou) kun je kwijt op plaatscode.be en niet hier op het forum.

16 antwoorden

Gesponsorde links
Offline roberini - 14/10/2008 10:08
Avatar van roberini HTML beginner codetags alsjeblieft!
Offline Erwt - 14/10/2008 10:09
Avatar van Erwt PHP beginner Deze code s.v.p op http://plaatscode.be.

Hier begin ik niet eens aan.
Offline Marc_Nijhuis - 14/10/2008 19:11
Avatar van Marc_Nijhuis Nieuw lid Ik heb de code geplaatste op

http://plaatscode.be/32545/
Offline BramBo - 14/10/2008 23:23 (laatste wijziging 15/10/2008 21:02)
Avatar van BramBo JS gevorderde Brrr... ik ben niet vies van wat cryptische code e.d. maar dit is niet te lezen, ik heb toevallig laatst een scriptje geschreven waar bij gehouden diende te worden waar de muis was dit werkte uitstekend cross-browser. Zal morgen even kijken waar ik 't heb en het hier posten.

Edit: Heb gekeken, maar kon natuurlijk weten dat het d.m.v. een js-framework is geschreven. geschreven in jQuery mocht je hiervan gebruik maken kan ik de code posten voor je.
Offline Marc_Nijhuis - 15/10/2008 22:47 (laatste wijziging 17/10/2008 19:38)
Avatar van Marc_Nijhuis Nieuw lid Is prima post het maar voor me als je wil, bedankt!
Ik ben nog niet echt thuis in javascript, maar kan dit script mijn probleem oplossen dan?

Kan iemand anders mij hierbij nog helpen? Ik zou het erg fijn vinden als ik dit probleem kan oplossen. Bedankt alvast.
Offline Martijn - 17/10/2008 19:41
Avatar van Martijn Crew PHP of je maakt gewoon geen popups. Alle firefox browsers blokkeren ze al, en de meeste mensen hebben er ook wel iets tegen. Met een rede, omdat ze #$%^&*(*&^% dom zijn. Als ik een amateur site bezoek, waar er een popup komt express van hun, kom ik niet meer terug.
Offline jc2 - 17/10/2008 22:18
Avatar van jc2 PHP interesse @Devioursoul: zo te zien is het niet echt een popup maar meer een div die bij mouseover te voorschijn komt. Had je kunnen zien als je de website had bekeken.
Offline Marc_Nijhuis - 18/10/2008 20:34 (laatste wijziging 19/10/2008 22:18)
Avatar van Marc_Nijhuis Nieuw lid Inderdaad, vele professionele game-sites werken, opgezet door bedrijven, werken met dit systeem, er is dus geen sprake van een popup maar van een mouseover script en de nieuwste versies van internet explorer en firefox blokkeren deze mouseover niet.

Heeft er nog iemand een oplossing voor mijn probleem of kan iemand mij vertellen waarom de positie van het onmouseover plaatje verandert bij scrollen in internet explorer?
Offline Kr4nKz1n - 20/10/2008 08:54
Avatar van Kr4nKz1n Onbekend
BramBo schreef:
Brrr... ik ben niet vies van wat cryptische code e.d. maar dit is niet te lezen.
JavaScript is bijna altijd zo geschreven (helaas).
Offline Kevin - 20/10/2008 10:38
Avatar van Kevin Crew Ajax/REST Geraak je aan je eigen code nog uit?
Offline BramBo - 20/10/2008 12:42
Avatar van BramBo JS gevorderde Heb 't te druk gehad de afgelopen dagen om er nog iets aan te doen, maar heb 't nu als nog bekeken en even het scriptje van mij aangepast zodat het doet zoals je zou willen.

Het script maakt gebruik van jQuery (ja ik ben een propagandist) je zult deze moeten downloaden: http://www.jquery.com


De code is hier te vinden: http://plaatscode.be/33208/

Kort: Het script indexeert alle links met de class `image_link`, hieraan bind het script 2 event handlers een onMouseOver en een onMouseOut deze beelden de afbeelding af die opgegeven is in de link onder image_link. Het zou anders kunnen, maar dan zal de selecteer $('...') wat geavanceerder worden, dit laat ik aan jezelf over. bekijk eens: http://docs.jqu...g_You_Want

($(function() { }); is een short hand voor $(document).ready();)
Offline Marc_Nijhuis - 20/10/2008 19:16 (laatste wijziging 20/10/2008 19:17)
Avatar van Marc_Nijhuis Nieuw lid Bedankt voor het script, ik heb het even uitgeprobeerd en het werkt goed.

De enige problemen die ik nu tegenkom zijn:

Dat bij het laden van de pagina het plaatje automatisch te voorschijn komt, ongeacht waar je de cursor op dat moment hebt.

Voor de rest zag ik dat je in css de width en height (onder de div "tooltip") hebt meegegeven. Veranderingen in het aantal pixels width en height hebben echter geen invloed op de grootte waarmee het plaatje wordt getoond. Ook gaf ik in dezelfde div een border-width mee van 1px, maar ook dit zag ik daarna niet in het getoonde plaatje terug.

Voor de duidelijkheid heb ik het even op mijn server gezet onder de pagina: http://www.spelletjes-online.net/Scripts/Test.html

De code staat op: http://plaatscode.be/33226/

Weet je misschien hoe ik dit kan oplossen?

Alvast bedankt!!
Offline BramBo - 20/10/2008 21:46
Avatar van BramBo JS gevorderde heb je de css van #tooltip aangepast ? Wanneer je deze aanpast moeten de afbeeldingen ook gewoon groter worden..

php code - Bekijk de code zonder highlighting - Klap code in 
  1. #tooltip {
  2. 	width               : 250px;
  3. 	height              : 250px;
  4. 	background   		: white;
  5. 	position     		: absolute;
  6. 	left				: 25px;
  7. 	top					: 38px;
  8. 	display         : none;
  9.    }
  10.  
  11. #tooltip img {
  12.   border : 1px solid #000;
  13. }
Offline Marc_Nijhuis - 21/10/2008 21:45 (laatste wijziging 22/10/2008 23:15)
Avatar van Marc_Nijhuis Nieuw lid Ik heb het script weer even opnieuw getest en stuit wederom op dezelfde problemen. Hier even de link naar de testpagina van het script:

http://www.spelletjes-online.net/Scripts/Test.html

Hier staat de code zoals die op bovenstaande pagina staat.

http://plaatscode.be/33442/

Zou je hier weer even naar willen kijken? Bedankt wederom!
Offline BramBo - 23/10/2008 15:43
Avatar van BramBo JS gevorderde Ajb: http://plaatscode.be/33505/ Incl. preloader. De plaatjes worden geindexeert op href van het a-element, verschillende plaatjes voor dezelfde href is dus Niet mogelijk.
Offline Marc_Nijhuis - 25/10/2008 11:51
Avatar van Marc_Nijhuis Nieuw lid Helemaal goed het script werkt perfect, iedereen bedankt!
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.223s