(CSS) Layer als button, maar hoe?

Discussie in 'PC, Handheld & Algemeen' gestart door Tha Mike, 15 feb 2004.

  1. Tha Mike

    Tha Mike The Good Die Young

    Berichten:
    576
    Leuk Bevonden:
    1
    Ik wil graag een complete layer als button gebruiken (dit om loze ruimte van een plaatje niet te hoeven gebruiken en zo laadtijd te besparen), weet iemand hier hoe dat moet (en of het kan?)

    (Ik heb al gegoogled en allerlei fora afgezogt)
     
    Tha Mike, 15 feb 2004
    #1
  2. Tha Mike

    Tha Mike The Good Die Young

    Berichten:
    576
    Leuk Bevonden:
    1
    Niemand verstand van CSS of Dreamweaver oid?????:'-(
     
    Tha Mike, 17 feb 2004
    #2
  3. Joeri71

    Joeri71 Keep an open mind...

    Berichten:
    732
    Leuk Bevonden:
    1
    Verstand van flash een beejte maar snap je probleem niet helemaal...
     
    Joeri71, 18 feb 2004
    #3
  4. HanTheMan

    HanTheMan XBW.nl VIP XBW.nl VIP

    Berichten:
    2.536
    Leuk Bevonden:
    74
    makkelijkste vind ik om gewoon 1 transparante pixel te maken en die te gebruiken neemt bijna geen ruimte in beslag :cool:
    en zou je evt als image map kunnen gebruiken.
     
    HanTheMan, 18 feb 2004
    #4
  5. Jerhui

    Jerhui <font color="orange"><b>XBW.nl VIP</b></font> XBW.nl VIP

    Berichten:
    1.081
    Leuk Bevonden:
    0
    Ik werk zelf veel met CSS, maar ik snap je vraag niet helemaal. Style sheets hebben namelijk niets met layers te maken. :confused:
     
    Jerhui, 18 feb 2004
    #5
  6. Tha Mike

    Tha Mike The Good Die Young

    Berichten:
    576
    Leuk Bevonden:
    1
    :confused: Je zal wel gelijk hebben ben ook maar een noob, ik heb een button gemaakt die 12 kb is (bovenaan staat tekst en daaronder is een "loze" ruimte), alleen wil ik nu graag om laadtijd te besparen die button (is dus gewoon een pic) kleiner maken zodat net de tekst erop staat en de achtergrond van de layer heb ik dezelfde kleur gegeven zodat het een geheel lijkt. (en een randje om die layer gemaakt) alleen kan je nu alleen nog maar op de tekst klikken dus omdat daar de link achter zit. Nu wil ik dus van de hele layer 1 grote button maken net zoals ik aan het begin had alleen dan met een veel lagere laadtijd. Ik heb al een beetje geprobeert om die layer in m'n link te zetten (met html editor van dw) maar dat werkte ook niet :mad:
     
    Tha Mike, 18 feb 2004
    #6
  7. Jerhui

    Jerhui <font color="orange"><b>XBW.nl VIP</b></font> XBW.nl VIP

    Berichten:
    1.081
    Leuk Bevonden:
    0
    Ik snap nog steeds niet precies wat je bedoelt... misschien moet je het eens laten zien ;)

    Om ruimte te besparen kun je ook afbeeldingen gebruiken die enorm klein zijn en deze vervolgens een grotere afmeting te geven.

    Het is mogelijk om een layer die als link werkt over een button heen te plaatsten, maar je zal nog wel iets in de layer moeten hebben, bijvoorbeeld een image. Vervolgens kun je het plaatje transparant maken waardoor je niets meer ziet zoals in dit voorbeeld:

    Code:
    <div id="Layer1" style="position:absolute; left:518px; 
top:508px; width:80px; height:25px; z-index:1"><a 
href="#"><img src="images/bg2.gif" width="100%" height="100%" border="0" 
style="FILTER: alpha(opacity:30)"></a></div>
    Hier staat de transparantie op 70%, maar het kan ook op 100%.

    Verder gebruik ik zelf altijd enorm veel tabellen om mijn site te maken, zeker iets waarin je je zou kunnen verdiepen.

    Kijk ook eens naar mijn site (sig) en misschien doe je wel ideeën op.

    Succes :)
     
    Jerhui, 19 feb 2004
    #7
  8. Tha Mike

    Tha Mike The Good Die Young

    Berichten:
    576
    Leuk Bevonden:
    1
    K zal ff kijken of ik wat ruimte bij m'n moeder kan kapen, dan zal ik ff wat uploaden.
     
    Tha Mike, 19 feb 2004
    #8
  9. Dioga

    Dioga Piraat

    Berichten:
    3.143
    Leuk Bevonden:
    52
    Bij Dreamweaver in de layer klikken en dan bij behaviours een link maken, zou volgens mij zo moeten werken, hoewel ik het nooit zo gedaan heb.
     
    Dioga, 19 feb 2004
    #9
  10. Jerhui

    Jerhui <font color="orange"><b>XBW.nl VIP</b></font> XBW.nl VIP

    Berichten:
    1.081
    Leuk Bevonden:
    0
    Dat heb ik als eerste geprobeerd, maar dat werkte niet. ;)
     
    Jerhui, 19 feb 2004
    #10
  11. Soulrebel

    Soulrebel G-Unit

    Berichten:
    119
    Leuk Bevonden:
    0
    Bedoel je dit?

    Code:
    <HTML>
<Style>
.MouseOver {background-Color: #eeee10; border: #000000;
	cursor:hand;
	position:absolute;
	width:39px; height:46px;
	color: #eeeee9;
	border-style: solid;
	border-color: #000000;
	border-width: 1px;
	}

.MouseOut {
	cursor:hand;
	position:absolute;
	width:39px; height:46px;
	background-color:#eeeeee;
	color: #FFffff;
	border-style: solid;
	border-color: #000000;
	border-width: 1px;
	
}
</STYLE>

</HEAD>

<BODY>

<div class="MouseOut" style= "z-index:0; left: 38px; top: 96px" OnMouseOver = "this.className = 'MouseOver';" OnMouseOut ="this.className = 'MouseOut'></div> 

</BODY>
</HTML>
    Een button gemaakt met behulp van CSS en Layers
     
    Soulrebel, 25 feb 2004
    #11

Deel Deze Pagina