szerokosc forum a div

wersja skryptu MyBB: 1.8.6
adres forum:  http://forumtrychologiczne.pl/index.php

Witam mam pytanie.. Czy jezeli szerokosc okna (w przegladarce) jest mała, jest mozliwosc ze dany div zniknie??
Chodzi mi o boczne menu..


Jezeli szerokosc okna jest dana np tyle:  http://scr.hu/6zcw/97zk2
to mozna zrobic, ze boczne menu nie bedzie na dole, tylko zniknie??

a gdy szerokosc była by wieksza to okno to div się pokaze z boku(czyli normalnie)??

Pozdrawiam!

https://kursbootstrap.pl/widocznosc-elem...utilities/

https://developer.mozilla.org/en-US/docs...ia_queries

Przykład dla twojego forum:

@media (max-width: 600px) {
  #logo { display: none; }
  #sidebar { background: red; }
}

Chcesz ukryć menu boczne dla x rozdzielczości, więc zastosuj na nim regułę media, gdzie zastosujesz display ustawiony na none.

ok działa .. korzystam z tego sposobu:

@media (max-width: 600px) {
 #logo { display: none; }
 #sidebar { background: red; }
}

tylko mam teraz mam problem z
z górnym panelem-paskiem.. chce zrobic tak, ze jezeli szerokosc jest mniejsza niz 730px to pasek sie odczepia i jest u góry w spoczynku..
chodzi o ten pasek:http://scr.hu/6zcw/n4orf


moj kod:

@media (max-width: 730px) {
   #panel .upper{ display:none;}
}

panel rzeczywiscie znika tylko juz sie nie pojawia u góry a chce aby sie pojawial (aby byl jakby w spoczynku)..
Pozdrawiam

Display odpowiada za samo wyświetlanie (w jaki sposób ma dany element być wyświetlany).
Potrzebujesz tutaj zastosować position. https://developer.mozilla.org/en/docs/Web/CSS/position

sprawdziłem wszystkie te argumenty od position i nie działa ;/

zrobiłem taki kod:

#panel.stick#panel .lower{  display:none; }

teraz działa na takiej zasadzie ze znika i u góry sie pokazuje (tak jak chciałem) tylko on sie pokazuje nagle (jakby sie nagle wklejał, co przesuwa forum w dół, a chce aby tam jakby zawsze był i zeby forum sie nie przesuwało)

Z pliku everest.js usuń:


var $window = $(window),
       $spanel = $("#panel"),
       $anch = $("#panchor");
   $window.scroll(function() {
       var w = $window.scrollTop();
       var d = $anch.offset().top;
       if (w > d) {
           $spanel.addClass("stick");
           $anch.height($spanel.height())
       } else {
           $spanel.removeClass("stick");
           $anch.height(0)
       }
   })


Nie wiem czy na pewno o to ci chodzi.

wiem - nie potrafię tłumaczyć i dlatego.

Chce zrobic takie cos:
- jezeli forum jest szersze niz 744px to przesuwanie paska działa (za co odpowiada kod powyzej)
- jezeli forum jest węższe niz 744px to pasek znajduje sie tylko na samej górze(zaraz przed logo)

i udało mi się uzyskać taki efekt poprzez:

@media only screen and (max-width:744px)
{
     #panchor{display:none;}
}

- wiem w temacie była mowa o jednym pasku(białym) lecz postanowiłem jednak ze bedzie to cały panel (2paski)

tylko teraz jest mini-mini problemik..
otóż gdy jesteśmy np na  środku forum i powiększymy forum tak aby szerokość była węższa (alt+enter) niz 744 to kod działa dopiero gdy zjedziemy np 1px w dół lub 1px w góre, a ja chce uzyskać taki efekt bez ruszania się na forum.


zrobilem takie cos:

var $window = $(window),
      $spanel = $("#panel"),
      $anch = $("#panchor");
  $window.scroll(function() {
      var w = $window.scrollTop();
      var d = $anch.offset().top;
       var fs=window.innerWidth;
    if(w>d && fs>800){
          $spanel.addClass("stick");
          $anch.height($spanel.height())
      } else {
          $spanel.removeClass("stick");
          $anch.height(0)
      }
  })

lecz efekt jest nadal ten sam ;/

da się jakoś dynamicznie to chowac np jakos powoli za pomoca js??
Pozdrawiam!

Tak się dzieje, bo zdarzenie którego używasz (scroll) zachodzi jedynie podczas przesuwania (gdy scrollujesz kółkiem, przesuwasz suwak, strzałki i spacja bodajże też).

Powinieneś użyć tutaj zdarzenia resize()

działa perfekcyjnie! dziekuje! a można to jakos zrobić aby ten pasek np chował się do góry (tak jak sidebar w bok tylko do góry?)

Możesz użyć do tego slideUp().

znaczy odwołuje to: działa perfekcyjne - mój błąd .. nie sprawdziłem wszystkiego
gdy odświeżyłem strone (okno szersze niz 744) pasek nie był przypięty a powinien!

dopiero po rozciągnięciu okna/forum pasek zaczął działać dobrze..

funkcją łącząca te 2 funkcje: scroll() resize() działała by idealnie

jest na to jakis sposób?

Pozdrawiam !

Możesz po prostu wywołać to od razu w document ready (gdy strona zostaje załadowana).

dobra pobawię się z tym troche.. temat rozwiazany.. dzieki