Som besökare på Hamsterpaj samtycker du till användandet av s.k. cookies för att förbättra din upplevelse hos oss. Jag förstår, ta bort denna ruta!
Annons

Hjälp att lägga till en sak i en psd

Skapad av Chris, 2014-04-28 21:25 i Foto, bild & grafik

3 116
5 inlägg
0 poäng
Chris
Visningsbild
P 33 Hjälte 4 inlägg
2014-04-28 21:25
0
tja. jag har en psd till min sida, men har nada koll på hur photoshop fungerar. och det är en fett lätt ändring så undrar om någon skulle vilja hjälpa mig.

länk till psdn: http://www.speedyshare.com/dWU84/stars.psd

jag vill lägga till så att 0.5/5 stjärnor finns och att 0/5 stjärnor finns. på samma vis som den är uppbyggd sedan tidigare.

all hjälp uppskattas
Direktlänk Svara på inlägg Gästbok
Skicka

Är reklamen ivägen? Logga in eller registrera dig så försvinner den!

Tvillingen
Visningsbild
P 31 Hjälte 3 117 inlägg
2014-04-28 22:15
0
Jag skulle nöja mig med att endast ha tre stjärnor, en som är hel, en halv och en tom. Skulle sedan hantera resten med hjälp av CSS och vill du göra så att användaren kan dra över stjärnorna och själva sätta betyg underlättar det. Då kan du sätta ett event för när man håller musen över varje separat stjärna.

En till fördel är att du får ner storleken på bilden lite, må verka meningslöst när bilden redan är så liten, men fördelaktigt om det är mycket annat som ska läsas in. En till fördel med den här metoden är att du kan lägga in mer bilder i filen än bara stjärnor, då blir det heller inte lika många förfrågningar till servern. Både bra för användaren och servern. Vill du läsa mer om det kan du googla CSS sprites och ett litet exempel på hur en större sådan kan se ut kan du se här på Hamsterpaj.

http://static.hamsterpaj.net/gfx/layout/s.png

Bilden på stjärnorna
http://i57.tinypic.com/ic4oew.png

HTML + CSS
http://jsfiddle.net/87Cge/

Jag är ond!

Direktlänk Svara på inlägg Gästbok
Skicka
Chris
Visningsbild
P 33 Hjälte 4 inlägg
Trådskapare
2014-04-28 22:35
0
Svar till Tvillingen [Gå till post]:
jag hatar allt som har med css att göra. det är ett så tråkigt och jobbigt språk att skriva i.

men om vi gör som du tipsade. hur lägger jag så jag får det jag vill ha då? eftersom jag vill ha 10 olika kombinationer.

0/5
0.5/5
1/5
1.5/5
2/5
2.5/5
3/5
3.5/5
4/5
4.5/5
5/5

/* ——————————— RATINGS ——————————— */

.rating_stars { display: block; height: 20px; width: 105px; margin:0 0 5px; }

.post .rating_stars { position: absolute; right: 10px; top: 12px; }

.rating_stars div { display: block; height: 20px; width: 105px; background-repeat:no-repeat; background-image:url(“../images/stars_yellow.png”); /* colors are yellow, orange, red, blue, and black. */ }

.rating_stars .stars_10 { background-position: 0 0; }

.rating_stars .stars_15 { background-position: 0 -20px; }

.rating_stars .stars_20 { background-position: 0 -40px;

detta är koden jag använder idag. därför tänkte jag de bara vore lättare att lägga till 2 extra delar, eftersom hela min sida är färdigbyggd utom mindre "improvements" som detta

Direktlänk Svara på inlägg Gästbok
Skicka
Tvillingen
Visningsbild
P 31 Hjälte 3 117 inlägg
2014-04-28 22:58
0

Svar till Chris [Gå till post]:
På så vis, ja då blir det nog lättare att endast lägga till två nya bilder och två nya rader i din CSS. Nu orkar jag heller inte göra det då Photoshop är riktigt tråkigt och jag är också dålig i det, men det blir nog lättare för dig att redigera bilden i Photoshop om du laddar öppnar din png-fil istället. Då är det bara att kopiera och klistra in, gör bara ett nytt dokument som är högre och klistra in stjärnor. Du borde dessutom försöka få koll på CSS även om det känns tråkigt just nu, för ska du bygga hemsidor är det där den största skillnaden görs utseendemässigt.

Vill du göra på mitt sätt, vilket jag tycker är mer lätthanterligt i längden fungerar det så här.

Alla stjärnor har en div som har klassen stars som parent, en och samma div för alla stjärnor där alltså. Varje stjärna ligger sedan i en separat div med klassen star. Den sköter storleken på diven samt att den har en float: left, så att det inte blir några radbrytningar. Diven med klassen star behöver dessutom en till klass full-star, half-star eller empty-star och det är den som hanterar vilken av stjärnorna som ska visas.

Så för att göra de tre olika stjärnorna som finns gör du så här.
Ett stycke html-kod:
<div class="star full-star"></div>
<div class="star half-star"></div>
<div class="star empty-star"></div>


Dessa ska ligga i diven stars, men har även lagt till en div med klassen clear där, för vi använder oss av en float och det gör att nästa element efter diven stars hamnar på en ny rad.
Ett stycke html-kod:
<div class="stars">
 <!-- Alla divar med stjärnor ska ligga här -->
 <div class="clear"></div>
</div>


En till fördel med det här att det blir lättare om du helt plötsligt får för dig att du vill använda dig av tio stjärnor istället för bara fem och så vidare. Nu vet jag inte hur du kommer att behöva ändra din nuvarande HTML-kod, för jag vet inte hur den ser ut. Kör du något språk på servern också, PHP exempelvis? Då kan du behöva ändra där också, men då behövs även koden dit om du ska ha hjälp. Ett till litet tips är att testa det här separat först innan du försöker ändra din nuvarande kod, för blir lättare om du förstår hur det är uppbyggt först.

Jag är ond!

Direktlänk Svara på inlägg Gästbok
Skicka
Chris
Visningsbild
P 33 Hjälte 4 inlägg
Trådskapare
2014-04-28 23:02
0

Svar till Tvillingen [Gå till post]:
kör php på min server ja.

och jag har köpt en färdig css för att behöva utveckla så lite grafiskt som möjligt. jag är blind för saker som ser snyggt ut, men behöver fixa detta för att han som gjorde cssen inkluderade endast 1 stjärna som lägsta ranking.

anyhow,ska inte bygga hemsidor. har en enda som jag ska jobba med, som jag aldrig någonsin kommer att röra css koden på i större utsträckning.
har lagt till egna klasser och sånt jag använder dagligen, och denna delen ligger i en cache så kommer inte anstränga servern speciellt mycket.

men tackar för din hjälp och letar vidare för att någon kanske kan göra detta för mig

Direktlänk Svara på inlägg Gästbok
Skicka

Forum » Fritid » Foto, bild & grafik » Hjälp att lägga till en sak i en psd

Ansvariga ordningsvakter:

Användare som läser i den här tråden just nu

1 utloggad

Skriv ett nytt inlägg

Hej! Innan du skriver om ett potentiellt problem så vill vi påminna dig om att du faktiskt inte är ensam. Du är inte onormal och världen kommer inte att gå under, vi lovar! Så slappna av och gilla livet i några minuter - känns det fortfarande hemskt? Skriv gärna ner dina tankar och frågor, vi älskar att hjälpa just dig!

Den här tråden är äldre än Rojks drömtjej!

Det senaste inlägget i den här tråden skrevs för över tre månader sedan. Är du säker på att du vill återuppliva diskussionen? Har du något vettigt att tillföra eller passar din fråga i en ny tråd? Onödiga återupplivningar kommer att låsas så tänk efter en extra gång!

Rubrik

Inlägg

Fet Kursiv Spoiler Bild Film Kod Undersökning

Förhandsgranska Spara

Hjälp

Det här är en hjälpruta

Här får du korta tips och förklaringar om forumet. Välj kapitel i rullningslisten här ovanför.

Rutan uppdateras automagiskt

När du använder funktioner i forumet så visas bra tips här.


Annons
Annons
Annons
Annons