Het MacFreak® Forum - Voor online ondersteuning in het Nederlands!

    Het MacFreak® Forum
     Vragen: Webdesign & Internet ontwikkeling
         Rollover box in de weg
                
Welkom bij Vragen: Webdesign & Internet ontwikkeling 

      Forum gemodereerd door: Moderator  
  Spring naar onderwerp
« Ouder - Nieuwer »  
Onderwerp met meerdere pagina's:
   [ 1 2 ]    Volgende »

    

       
Robert Heemskerk
Niet Aanwezig



MacFreak Veteraan
Aantal berichten: 133 | Lid sinds: 24-01-2010 | Geplaatst om: 13:45 - 10-11-2012
hi webdesign en internetforum,

Ik heb een rollover gemaakt (wat maak ik)

http://robertheemskerk.nl/knoptest5.html

Als je nu over de box heen scollt, dan wordt ie deels overlapt door de box waar de rolloverafbeelding in verschijnt.. Dat wil ik voorkomen, dat wil ik niet..

Hoe kan ik dit simpel oplossen?

Verder snap ik ook even niet waarom er nu een kader zichtbaar is van die box waarin de afbeelding in verschijnt, en dat vraagteken?

Mocht iemand een oplossing voor deze kwestie hebben dan hoor ik dat graag.

groeten Robert

(Bewerkt door Robert Heemskerk om 13:46, 10-11-2012)




http://www.robertheemskerk.nl/Pvdd.html

orange
Niet Aanwezig




Een ware MacFreak!
Aantal berichten: 1770 | Lid sinds: 29-08-2007 | Geplaatst om: 19:26 - 10-11-2012
Er rolt bij mij helemaal niets over.

Daar zit de eerste fout dus al.



n.b.: Oh, sorry. Dat bedoel je dus ook.   
Ik zie nu de roll-over verschijnen ja.

Anyway... ik weet het niet.

(Bewerkt door orange om 19:28, 10-11-2012)

Shmoo
Niet Aanwezig




Een ware MacFreak!
Aantal berichten: 3136 | Lid sinds: 11-11-2011 | Geplaatst om: 04:15 - 11-11-2012
Het is mij ook nog niet zo heel goed zichtbaar wat het moet worden maar ik denk wel dat het een stuk leaner kan.
in-line CSS gebruiken we al een tijdje niet meer dus dat moet je echt in een externe stylesheet gaan zetten.

Ik heb even snel iets gemaakt dat denk ik in de richting zit, puur HTML en CSS zonder afbeeldingen.

http://cssdesk.com/QnqXq

Zoals je ziet is de speech-bubbel nog niet helemaal netjes maar dat kun je hier en daar bijschaven aan de hand van de hoeveelheid tekst die erin komt.
Durf CSS waardes te veranderen en zie wat gaat gebeuren het is een Live editor.

Robert Heemskerk
Niet Aanwezig



MacFreak Veteraan
Aantal berichten: 133 | Lid sinds: 24-01-2010 | Geplaatst om: 13:17 - 11-11-2012
Hartelijk bedankt Shmoo!

Ik ga er z.s.m. mee aan de slag.

groeten Robert

  




http://www.robertheemskerk.nl/Pvdd.html

Robert Heemskerk
Niet Aanwezig



MacFreak Veteraan
Aantal berichten: 133 | Lid sinds: 24-01-2010 | Geplaatst om: 16:08 - 15-11-2012
Ik moet in ieder geval een Linked CSS sheet maken.

Ik wil het in Dreamweaver CS5 gaan maken, dat moet mogelijk zijn volgens mij.

groeten Robert




http://www.robertheemskerk.nl/Pvdd.html

Shmoo
Niet Aanwezig




Een ware MacFreak!
Aantal berichten: 3136 | Lid sinds: 11-11-2011 | Geplaatst om: 16:38 - 15-11-2012
Ja hoor je moet alleen HTML gaan scheiden van de CSS dat zijn twee verschillende dingen.

Met HTML bouw je de website en zorg je dat bijv. teksten op het scherm komen en CSS is voor het positioneren en stijlen-/opmaken van de layout.

Dus een extra nieuw leeg document aanmaken die je stylesheet noemt met de .CSS extensie daar plaats je alle CSS codes in.
En dat externe bestand spreek je dan aan in de HEAD van je HTML pagina op deze manier.

Code:

<html>
<head>

<link rel="stylesheet" type="text/css" href="http://www.example.com/css/stylesheet.css">

</head>
<body>
...



http://www.w3schools.com/css/css_howto.asp

Robert Heemskerk
Niet Aanwezig



MacFreak Veteraan
Aantal berichten: 133 | Lid sinds: 24-01-2010 | Geplaatst om: 10:03 - 20-11-2012
Bedankt voor jouw reactie Shmoo,

Ik heb nu een externe stylesheet gemaakt.
Het is nu ook een heel stuk overzichtelijker.
En ik begrijp er wat meer van nu.

Nu zit ik alleen nog met ''het probleem'' dat de hoover vd afbeelding een gebied afdekt van een andere link (overlapt).
Ik zou graag alleen de woorden(in voorbeeld' wat maak ik?, wie ben ik? etc.) actief willen maken zodat er geen overlapping meer is.

hierbij de situatie nu;

http://robertheemskerk.nl/testsite.html

(Bewerkt door Robert Heemskerk om 11:09, 20-11-2012)

(Bewerkt door Robert Heemskerk om 11:10, 20-11-2012)




http://www.robertheemskerk.nl/Pvdd.html

Robert Heemskerk
Niet Aanwezig



MacFreak Veteraan
Aantal berichten: 133 | Lid sinds: 24-01-2010 | Geplaatst om: 10:19 - 27-11-2012
Nogmaals bedankt Shmoo, voor jouw inzet!

- Ik ben nog bezig geweest om het d.m.v. rollovers in CSS te maken, met afbeeldingen maar het is beter denk ik om het tekstgedeelte als tekst te houden en dus niet te kiezen voor afbeeldingen (die worden ook ranzig bij vergroting)
- Verder nog gekeken of ik het kon oplossen via een CSS-rollover (CSS single of multiple elements remote area);
http://www.onextrapixel.com/2009/05/12/how-to-create-pure-css-rollover-to-display-single-or-multiple-elements-at-remote-area/

Maar dan kom ik toch uit op jouw opzet, de andere woden toch wat te ingewikkeld voor mij.

Ik heb de tekstballon versimpeld, in een cirkel.

Waar ik nu nog niet uitkom, is dat ik teksten wil bewerken (style) van zegmaar de vraag en het antwoord (in de ballon). Het liefst zou ik deze in een opzichzelfstaande CSS-style hebben staan.
Ook zou ik de stand vd tekst in de ballon willen aanpassen (verticale basislijn verschuiving?)
Ik wil meerdere van dit soort items op mijn pagina zetten en deze onafhankelijk van elkaar willen positioneren en stylen.

Misschien heb jij nog een goed idee of suggestie of kan iemand anders me een goede tip geven.

Hierbij nu een versie waarbij ik de voorgaande tekstballon heb gewijzigd in een nieuwe ballon (zonder aanhangsel aan de ballon)
http://robertheemskerk.nl/ballonnen.html

groeten Robert

(Bewerkt door Robert Heemskerk om 10:21, 27-11-2012)

(Bewerkt door Robert Heemskerk om 10:33, 27-11-2012)

(Bewerkt door Robert Heemskerk om 10:34, 27-11-2012)




http://www.robertheemskerk.nl/Pvdd.html

Robert Heemskerk
Niet Aanwezig



MacFreak Veteraan
Aantal berichten: 133 | Lid sinds: 24-01-2010 | Geplaatst om: 11:55 - 04-12-2012
In CSS Rollover met (soort van) speechballon gemaakt;

http://robertheemskerk.nl/Hover3.html

Ik probeer nu het ''aanhangsel'' te maken, aan de speechballon.
Dat lukt me niet. Het mag een heel eenvoudig soort aanhangseltje zijn.

Op het internet vindt ik wel allerlei voorbeelden van mooie speechballonnen(CSS) maar die zijn vooralsnog moeilijk te integreren in wat ik heb gemaakt.

Deze is wat tot nu toe het meest in de buurt komt:
http://robertheemskerk.nl/Hover.html

Maar dan zit ik met één hoek(rechtsonder) en dat de rand vh kader een uitsparing laat zien in de achtergrond (in de rode cirkel).

Weet iemand een ''simpele'' oplossing misschien?
Of hoe ik de speechballon beter kan integreren in mijn situatie?

groeten Robert




(Bewerkt door Robert Heemskerk om 11:56, 4-12-2012)




http://www.robertheemskerk.nl/Pvdd.html

Shmoo
Niet Aanwezig




Een ware MacFreak!
Aantal berichten: 3136 | Lid sinds: 11-11-2011 | Geplaatst om: 12:50 - 04-12-2012
Wat je moet doen is een extra klein vierkantje onder de speechballon maken met dezelfde achtergrondkleur (grijs) als de ballon zelf. Daarna roteer je deze 45 graden zodat je een punt omlaag krijgt en als laatste positioneer je dit kleine gedraaide viertje iets over de speechballon heen.
Op deze manier dek je grijs op grijs af en blijft het puntje onderaan zichtbaar omdat deze op het rood van de website-achtergrond valt.

Zoek maar eens op Rotate CSS.
http://davidwalsh.name/css-transform-rotate

       

Spring naar onderwerp
« Ouder - Nieuwer »
Onderwerp met meerdere pagina's:
   [ 1 2 ]    Volgende »

MF-Forum v6.0.0 © 2001/2013 - MacFreak® Interactive Media