[css]Pozycjonowanie w pionie obrazka, nieznając jego wysokości ?, Czy można w css jakoś odczytać wysokośc danego objektu? Opcje

[kukix]

Witam.

Znalazłem ciekawy przykład pozycjonowania elementu HTML w pionie http://www.intensivstation.ch/files/en_templates/temp11.html.

Problem jednak w tym, że nie znam wysokości danego elementu i nie mam jak ustawić górny margines.

Czy są w CSS jakieś zmienne/stałe, w których przetrzymywana jest np wysokość danego elementu? Można by wtedy to użyć do ustawienia górnego marginesu.


Potrzebuje wypozycjonować obrazek w pionie, jednak obrazki generowane są dynamicznie, nie znam ich wysokości.


Będe wdzięczny za wszelkie wypowiedzi.

[Damonsson]

A wartości procentowe?

W samym css, nie ma zmiennych. Można się bawić w łączenie z php, ale Twój problem pewnie można rozwiązać samym CSS.

[kukix]

Wielkie dzięki, znalazłedm skrypt jQuery, który pozycjonuje elementy w pionie.

Kod

(function ($) {
// VERTICALLY ALIGN FUNCTION
$.fn.vAlign = function() {
    return this.each(function(i){
    var ah = $(this).height();
    var ph = $(this).parent().height();
    var mh = Math.ceil((ph-ah) / 2);
    $(this).css('margin-top', mh);
    });
};
})(jQuery);


$(window).load(function(){
        $(".kolejne_zdj").vAlign();
});

Wszystko jest ok, gdy jest sam obrazek. Problem , gdy obrazek ma być linkiem.

Kod

//tutaj jest ok
<div>
  <img src="{SCIEZKA}" class="kolejne_zdj">
</div>

//tutaj wszystko się rozwala
<div>
  <a href="{LINK}">
    <img src="{SCIEZKA}" class="kolejne_zdj">
  </a>
</div>

Co można zrobić ze znacznikiem <A>, żeby nie przeszkadzał?

[Damonsson]

Nie wiem czy to poprawne i wg standardów i w ogóle...nie znam się na JS

Zamiast

[JAVASCRIPT] pobierz, plaintext 
var ph = $(this).parent().height();
[JAVASCRIPT] pobierz, plaintext 

Daj

[JAVASCRIPT] pobierz, plaintext 
var ph = $(this).parent().parent().height();
[JAVASCRIPT] pobierz, plaintext 

Działa

Ten post edytował Damonsson 13.09.2011, 14:57:43