éléments de positionnement par arrière-plan - CSS-JQuery

Question

Est-il possible de la position un de votre élément HTML lié à la fond étirées de votre page?

vous avez fait l'arrière-plan étiré,

maintenant vous voulez écrire quelque chose exactement à côté de votre logo.

compte tenu des résolutions et des navigateurs

CSS & JQuery

Si vous connaissez toute stratégie ou tout bon article/tutoriel

Je serais heureux de vous entendre

merci

Answer 1

Vous pouvez calculer les coordonnées dans la fenêtre pour faire correspondre les coordonnées étendues. Donc, si l'image de fond est étirée à l'arrière de la coordonnée (0,0) jusqu'à (window.screen.width, window.screen.height) et la taille de l'image est dit (800, 600), et votre logo est situé sur les coordonnées d'image (44, 100), et que vous voulez connaître les coordonnées de la fenêtre pour correspondre à celui de l'image ...

function place(div, image_x, image_y, image_w, image_h) 
{ 
    //Calculate the window coordinates that match the image coordinates 
    var window_x = Math.Floor((window.screen.width/image_w)*image_x); 
    var window_y = Math.Floor((window.screen.height/image_h)*image_y); 

    //Make divs position absolute 
    $("#"+div).css("position", "absolute"); 

    //Set the left in the window coords that match the images coords 
    $("#"+div).css("left", window_x+"px"); 

    //Set the top to match the images coords 
    $("#"+div).css("top", window_y+"px"); 
} 

vous utilisez la fonction comme ceci:

place("logo_text_div", 44, 100, 800, 600); 

Vous pouvez modifier le code afin qu'il utilise Ceil, vous obtiendrez les coords décalés vers la droite. Ou vous pouvez arrondir window_x et window_y d'une autre manière afin d'obtenir la préccision que vous voulez.

Answer 2

window.screen.width et window.screen.height peut vous être utile.