Comment mettre à l'échelle un lien, qui s'ouvre dans un Iframe, à 50% de sa largeur et hauteur d'origine

Question

Donc, si vous visitez www.mymanchesteruniverse.co.uk, vous verrez un iphone en bas de la page.

L'icône de la musique doit correspondre à music.mymanchesteruniverse.co.uk. Ce que je dois faire est de redimensionner seulement ce lien afin que la page affiche une taille normale, mais réduite à environ 50% de sa largeur et sa hauteur normales tout en s'intégrant parfaitement à l'iPhone. (En essayant de la faire ressembler à une page iPhone formated, qu'il est, juste raccord pas ici)

Le code du bouton/lien est dans ce div

<div id="apDiv4" onclick="window.open('http://music.mymanchesteruniverse.co.uk', '_self', 'scale=50')"></div>

Si quelqu'un peut aider Je modifie le code (et remplace mon «échelle = 50», car cela n'a pas fonctionné) Toute l'équipe de MyManchesterUniverse serait très reconnaissante.

Cheers, Nick

www.NickGarofalo.com

Answer 1

Vous pourriez être en mesure d'utiliser le CSS Zoom propriété - pris en charge dans IE 5.5+, Opera et Safari 4 et Chrome (vérifié, veuillez vérifier avant downvoting). Firefox est le seul navigateur principal qui ne supporte pas Zoom (objet bugzilla ici) mais vous pourriez utiliser la propriété "propriétaire" -moz-transformer dans Firefox 3.5.

#iframeid { 
    zoom: 0.75; 
    -moz-transform: scale(0.75); 
    -moz-transform-origin: 0 0; 
    -o-transform: scale(0.75); 
    -o-transform-origin: 0 0; 
    -webkit-transform: scale(0.75); 
    -webkit-transform-origin: 0 0; 
} 

J'ai utilisé ces réponses dans ce poste. Et puis vérifié cela fonctionne dans Firefox 3.6 dans votre page de démonstration.

How can I scale an entire web page with CSS? How can I scale the content of an iframe?