Cześć.

Chciałbym, aby po najechaniu na dany div (będzie ich kilka) wyświetlał się inny div, który jest wewnątrz (tyle, że ukryty), kod html prezentuje się mniej więcej w ten sposób:

[HTML] pobierz, plaintext 
<div class="item">
   <p>Oto jakiś tekst, widoczny normalnie - display: block</p>
   <div class="hover_item">ukryty div - z position: absolute; a sam .item ma position: relative</div>
</div>
 
<div class="item">
   <p>inna zawartość</p>
   <div class="hover_item">bla bla</div>
</div>
 
// itd...
[HTML] pobierz, plaintext 

Potrzebuje kodu, który będzie wyświetlał diva "hover_item", ale dobierał mu odpowiednio współrzędne (left lub right) - ponieważ nie chciałbym, aby po najechaniu na dany div rozsunęła się strona (w poziomie) - proszę spojrzeć na zdjęcie - CLICK - doszło do efektu hover na elemencie "#4" i prawidłowo wyświetliło zawartość "hover_item" - ponieważ wyświetliło go po prawej stronie - jeśli wyświetliłoby po lewej to strona by się rozsunęła i na dodatek zawartość hover_item byłaby ucięta.

Chodzi mi o podejście do sytuacji - w jaki sposób zabrać się za to, aby wartość "left" oraz "right" dla CSSa hover_item była dobierana prawidłowo.

Zbadaj odległość od diva nadrzędnego z position relative od krawędzi strony (lewej bądź prawej). Następnie sprawdź czy div z position absolute ma większą czy mniejszą szerokość od odległości do krawędzi strony i w zależności od tego ustalaj left lub right. Wszystko wykonalne w jQuery.

A nie lepiej dla kontenera wyżej dać position: relative i ustalić stałe koordynaty dla .hover_item?