background image resize

[antonisid]

Καλημερα

εχω δει σε πολλές ιστοσελίδες να έχουν για background μεγαλες σε αναλυση εικόνες , και ανάλογα την ανάλυση του κάθε επισκέπτη αλλάζει και το μέγεθος , χωρίς να βγαζει οριζοντιο και καθετο scrollbar.Δηλαδη παραμενει το μηκος 100%.

 

Ηθελα να ρωτησω πως γινεται κατι τετοιο με css , καθως και η φώτο που θα έχω για φόντο , αν θα πρεπει να έχει καποιο συγκεκριμένο μέγεθος για να ταιριάζει η αναλογία.

[VitamineQ]

για δες εδώ http://css-tricks.com/how-to-resizeable-background-image/

[antonisid]

Σ ευχαριστώ για την απάντηση καταρχείν. Το δοκίμασα αυτο που μου στειλες.

#img.source-image {

width: 100%;

position: absolute;

top: 0;

left: 0;

}

Δε δουλευει νομιζω καλα , κι βρηκα νομίζω λύση βάζοντας στο body , overflow: hidden; . Δε γνωρίζω βέβαια κατα πόσο αυτή η λύση είναι μπακαλίστικη. Φυσικά η ανάλυση της εικόνας δεν αλλάζει...

εχεις μηπως καμμια ιδεα πως με την img class που παρέθεσα μπορώ να κάνω κάτι για ν'αλλάζει και η ανάλυση της εικόνας μου αναλογα με την οθόνη του καθενός?

[Uberalles_gr]

Εγώ όταν μου είχε τύχει κάτι ανάλογο δεν άλλαζα την ανάλυση της εικόνας αλλά άλλαζα την ίδια την εικόνα(είναι πιο σωστό).

[antonisid]

Εγώ όταν μου είχε τύχει κάτι ανάλογο δεν άλλαζα την ανάλυση της εικόνας αλλά άλλαζα την ίδια την εικόνα(είναι πιο σωστό).

 

Δηλαδη ειχες κοψει την εικονα σε διαφορα μεγεθη κι αναλογα την αναλυση , με καποιο javascript ισως επέλεγες την αντίστοιχη φώτο?

 

Μπορείς να γίνεις λιγο πιο συγκεκριμένος?

[Uberalles_gr]

Ακριβώς, είχα ένα banner που ήθελε ο πελάτης όσο μεγάλωνει η ανάλυση να μεγαλώνει και αυτό(και εννοείται και το site).

Βασικά για 3 διαστάσεις το είχα κάνει: για όσες είναι για μικρότερες ή ίσες του 1024, για όσες είναι ανάμεσα σε 1024 και 1280 και για όσες είναι μεγαλύτερες από 1280.

Τώρα με το screen.width τσέκαρα την ανάλυση