Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Presbiopia - la 43 ani ?

Termen transcriere autovehicul

Cazare Timisoara pe 4-5 zile

Primele zile ale internetului per...
 Ditra 25

Casti USB-C ptr A-54

Aplicatie medicala / asistent med...

De ce vor atația politicieni...
 ERR_ADDRESS_UNREACHABLE

Legea 18/1968 Se mai aplica?

Digi conectare 2 routere prin fir

Succesiune notar versus instanta ...
 Montaj aer conditionat in balcon ...

Cont curent mulți valuta far...

Sugestii plan casa

Experiente cu firme care cumpara ...
 

css: hover si font

- - - - -
  • Please log in to reply
10 replies to this topic

#1
boghy933

boghy933

    Member

  • Grup: Members
  • Posts: 702
  • Înscris: 16.10.2009
am doua probleme cu css:

1: folosesc niste fonturi pe site puse de mine cu formatul .ttf si folosesc urmatorul cod:

@font-face {
font-family: 'amaze_bold';
src: local('amaze_bold'), url('font/amaze_bold.ttf') format('truetype');
}

ori este ceva gresit ori nustiu, dar fontul este vizualizat doar de Firefox, explorer nu mil vede...
cum pot face sa folosesc fonturile si sa le vizualizez pe toate browser-ele.

2:am o imagine ce se schimba cand mouse-ul se duce pe ea.. in mod corect, cred, am folosit hover

                #img{
                          height: 23px;
                  width: 90px;
                          background-image: url(img.png);
                          background-repeat: no-repeat;
                  clear: both;
                  margin: 0 auto;
                  padding: 0;
                       }

               #img:hover {
                          background: url(img1.png);
                                  background-repeat: no-repeat;
                          color: ;
                                  }
problema este urmatoarea: pe firefox imaginea se schimba, pe explorer nu..
cum pot rezolva asta ?

Edited by boghy933, 25 December 2009 - 21:49.


#2
senoctar

senoctar

    Member

  • Grup: Members
  • Posts: 733
  • Înscris: 01.07.2006
1. IE nu suporta TrueType
http://webfonts.info...browser_support

2. probabil are ceva IE-ul, suporta hover doar de la 7 in sus (pe altceva in afara de link-uri)
Insa si CSS-ul tau pare ciudat, nu este bine sa folosesti proprietati shorthand impreuna cu cele explicite decat daca ai neaparat nevoie, apoi in sintaxa proprietatii shorthand "background", culoarea este prima nu url-ul (chiar daca browserul se prinde), apoi mai ai si "color: ; ".
Incearca sa alternezi acceasi proprietate in hover/normal, fie shorthand-ul fie cel explicit.

#3
boghy933

boghy933

    Member

  • Grup: Members
  • Posts: 702
  • Înscris: 16.10.2009
color: ; e eroarea mea  :P

dar nu inteleg cum as putea rezolva problema cu hover... am destula nevoie de a schimba imaginea in momentul in care mouse-ul se duce pe ea... si nu prea stiu cum sa fac altfel.. as putea folosi javascript dar as prefera sa evit...

alt mod de a utiliza fonturile mai exista ?

Edited by boghy933, 25 December 2009 - 22:12.


#4
senoctar

senoctar

    Member

  • Grup: Members
  • Posts: 733
  • Înscris: 01.07.2006

View Postboghy933, on 25th December 2009, 22:05, said:

color: ; e eroarea mea  :P

dar nu inteleg cum as putea rezolva problema cu hover... am destula nevoie de a schimba imaginea in momentul in care mouse-ul se duce pe ea... si nu prea stiu cum sa fac altfel.. as putea folosi javascript dar as prefera sa evit...
Cam ciudat, pe unde m-am uitat scrie ca IE7 (si mai sus) suporta hover pe orice element. Dar se pare ca nu este asa, in codul tau nu se schimba nimic pe img, nu numai imaginea. uite un cod care merge si pe IE:
<html>
<head>
<style type="text/css">
a{
background-image: url(http://hof.povray.org/images/bigthumb/pebbles.jpg);
color:#FF0000;
width:200px;
height:200px;
}
a:hover {
background-image: url(http://hof.povray.org/images/bigthumb/Boreal_big.jpg);
color:#FF00FF;
width:200px;
height:200px;
}  

</style>
</head>

<body>
<a href="default.asp" target="_blank">This is a link</a>
</body>
</html>
Demo : http://jsbin.com/ipiya

Edited by senoctar, 25 December 2009 - 22:16.


#5
boghy933

boghy933

    Member

  • Grup: Members
  • Posts: 702
  • Înscris: 16.10.2009
ok multumesc am rezolvat problema cu hover  :)
dar mia ramas cea cu fonturile... in ce mod as putea face sa folosesc fonturile si pe explorer?..

#6
Danbog_1920

Danbog_1920

    Active Member

  • Grup: Banned
  • Posts: 1,910
  • Înscris: 24.10.2008
Pai esti constient de faptul ca nu o sa iti apara decat tie, nu ? Deoarece trebuie instalat in pc ca sa mearga (cred)

#7
boghy933

boghy933

    Member

  • Grup: Members
  • Posts: 702
  • Înscris: 16.10.2009

View PostBogdan2901, on 26th December 2009, 00:03, said:

Pai esti constient de faptul ca nu o sa iti apara decat tie, nu ? Deoarece trebuie instalat in pc ca sa mearga (cred)

folosind:

@font-face {
font-family: 'amaze_bold';
src: local('amaze_bold'), url('font/amaze_bold.ttf') format('truetype');
}

toate persoanele care folosesc Firefox pot sa vizualizeze fontul... odata ce fontul este incarcat in folderul specificat...
banuiesc ca exista si un mod pentru a face ca si utilizatori de explorer sa vada acest font... :P

#8
senoctar

senoctar

    Member

  • Grup: Members
  • Posts: 733
  • Înscris: 01.07.2006
Uite 2 tutoriale pentru prima problema :

http://randsco.com/i...2009/07/04/p680
http://blog.themefor...t-face-support/

#9
boghy933

boghy933

    Member

  • Grup: Members
  • Posts: 702
  • Înscris: 16.10.2009
ok am inteles care este problema  :) multumesc de ajutor  :)

#10
MembruAnonim

MembruAnonim

    MembruAnonim

  • Grup: Banned
  • Posts: 398,284
  • Înscris: 08.10.2015
C'mon... Ai găsit CUM să folosești @font-face dar nu ai găsit și compatibilitatea cu browserele? :|

Oricum, dacă vrei neapărat să ai fonturi exotice, folosește cu încredere Cufon, Flir, Sifr etc

#11
boghy933

boghy933

    Member

  • Grup: Members
  • Posts: 702
  • Înscris: 16.10.2009
daca te uiti pe al doilea link este o imagine cu fisierele de fonturi si cu compatibilitatea lor in browsere eu aveam ttf ce era compatibil doar cu mozilla safari chrome si opera de asta nu mil vedea pe explorer, explorer e compatibil doar cu .eot, deci tot ce a trebuit sa fac a fost a fost sa convertez fonturile si in .eot si sa le introduc in @font-face.

[ http://themeforest.s3.amazonaws.com/133_font/formats.png - Pentru incarcare in pagina (embed) Click aici ]

Anunturi

Bun venit pe Forumul Softpedia!

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate