Zestaw ramek nie zmienia rozmiaru poprawnie po zmianie rozmiaru za pomocą myszy

Mam zestaw ramek, w którym w jednej ramce znajduje się przycisk, który minimalizuje macierzysty zestaw ramek do określonego rozmiaru.Zestaw ramek nie zmienia rozmiaru poprawnie po zmianie rozmiaru za pomocą myszy

Kod działa, ale problem polega na tym, że najpierw wybiorę ręczną zmianę rozmiaru ramki za pomocą mojej myszy, a następnie przycisk "Minimalizuj" spowoduje niepoprawną zmianę rozmiaru w IE8 i Chrome. Poprawnie zmienia rozmiar w FF.

mam tej struktury HTML

... 
<frameset cols="32%,*" border="2" frameborder="1" framespacing="1"> 
    <frameset rows="350,*" border="2" frameborder="1" framespacing="1" id="searchResultFrameset"> 
     <!-- The minimize button are in this frame searchResultFrame --> 
     <frame name="searchResultFrame" scrolling="no" src="dummy"> 
     <frame name="itemFrame" frameborder="1" scrolling="no" id="itemFrame" src="dummy2"></frameset> 
    <frame name="contentFrame" frameborder="0" scrolling="yes" id="contentFrame" src="dummy3"> 
</frameset> 
...

i ten kod, który wykonuje po naciśnięciu przycisku.

// Minimize frame button 
$('.minimizeFrame').toggle(function() { 
    parent.document.getElementsByTagName('frameset')[1].setAttribute('cols','22,*'); 
}, function() { 
    parent.document.getElementsByTagName('frameset')[1].setAttribute('cols','32%,*'); 
});

widzę, że cols="32%,*" zmiany cols="22,*" w dostarczaniu narzędzi programistycznych, ale nadal to czynią w niewłaściwym rozmiarze.

Dlaczego zmienia rozmiar nieprawidłowo po wprowadzeniu zmian za pomocą myszy? Czy brakuje mi czegoś lub jest to błąd w przeglądarce? A może istnieje alternatywne rozwiązanie do zmiany rozmiaru ramki bez tego błędu?

Przykład

http://jsbin.com/ohihiy/2

Źródło

2012-12-03 Codler

Mam również ten problem. Wygląda na to, że cokolwiek ustawisz w cols, zawsze będzie ono relatywne w stosunku do tego, do którego zostało zmienione, a nie całkowite. Wygląda na to, że Safari działa tak samo jak Chrome, podczas gdy Firefox działa zgodnie z oczekiwaniami! – Joel

Pojawia się, gdy zmienisz rozmiar ręcznie przy użyciu obramowania ramki, nie ma możliwości zmiany rozmiaru ramki poprawnie programowo. – Joel

W przykładowym kodzie Js Codlera ustawiany jest atrybut cols drugiego (wewnętrznego) zestawu ramek. Zgaduję, że zewnętrzny zestaw ramek miał zostać ustawiony. – Rembunator

Jeśli dobrze rozumiem próbujesz ustawić atrybut obiektu, który znajduje się w innej ramce. Niektóre przeglądarki tego nie akceptują.

Jeśli próbuję odtworzyć Twój problem, widzę, że w firefoxie mogę przełączać rozmiar ramki (bez problemu).

W chromie jednak pojawia się błąd bezpieczeństwa, ponieważ próbuję ustawić właściwość na innej stronie, a mianowicie stronę zestawu ramek z poziomu strony wewnątrz ramki.

edycja: Poniższy kod działa w IE8. Czy to jest to, czego potrzebujesz?

Nie zapomnij dodać plik jQuery-1.8.2.min.js

plik: index.html

<!doctype html public "-//w3c//dtd html 4.01 frameset//en" 
    "http://www.w3.org/tr/html4/frameset.dtd"> 
<html> 
<head> 
<title>a simple frameset document</title> 
</head> 

<frameset cols="32%,*" border="2" frameborder="1" framespacing="1"> 
    <frameset rows="350,*" border="2" frameborder="1" framespacing="1" id="searchResultFrameset"> 
     <!-- The minimize button are in this frame searchResultFrame --> 
     <frame name="searchResultFrame" scrolling="no" src="frame1.html"> 
     <frame name="itemFrame" frameborder="1" scrolling="no" id="itemFrame" src="dummy2"></frameset> 
    <frame name="contentFrame" frameborder="0" scrolling="yes" id="contentFrame" src="dummy3"> 
</frameset> 

</html>

file: ramka1.html

<html> 
    <head> 
    <script src="jquery-1.8.2.min.js"></script> 

    <script> 

    $(init_page); 

    function init_page() 
     { 
     // Minimize frame button 
     $('#minimizeButton') 
     .toggle(function() 
      { 
      parent.document.getElementsByTagName('frameset')[0].setAttribute('cols','22,*'); 
      }, 
      function() 
      { 
      parent.document.getElementsByTagName('frameset')[0].setAttribute('cols','32%,*'); 
      }); 
     } 

    </script> 
    </head> 
    <body> 
    <button id='minimizeButton'>toggle</button> 
    </body> 
</html>

Źródło

2013-02-18 09:26:28 Rembunator

Nie sądzę, że zrozumiałeś. Próbujemy ustawić właściwość cols dla skalowanego zestawu ramek, z dowolnego zakresu okna (góra, taki sam jak zestaw ramek, element potomny), daje taki sam wynik. Jest to problem z tym, jak zestaw ramek jest renderowany po zmianie jego rozmiaru za pomocą myszy, a nie problemach z zabezpieczeniami podczas uzyskiwania dostępu do właściwości ramki. – Joel

Zaktualizowałem moją odpowiedź. – Rembunator

Co zaskakujące, kiedy ponownie testuję na IE8, wygląda na to, że działa poprawnie, ale nadal działa w Chrome. – Codler

Wygląda na to, że ten błąd w Webkit został zignorowany od 201 0:

https://bugs.webkit.org/show_bug.cgi?id=36584

Źródło

2013-10-01 17:31:10

miałem ten sam problem, a ja sugestię ukryciu, następnie ustawienie, a następnie pojawiając i pracował dla mnie. Zobacz poniżej przykład:

var $frames = $(<parentElement>).find('<framesetname>')[ 0 ]; 
frames.hide().attr('cols', '*,500').show();

Pracowali dla Chrome, Firefox, IE11 & Opera. Mam nadzieję, że to działa dla Ciebie.

Źródło

2016-11-02 20:29:29

Wygląda na to, że nie można wywołać funkcji hide() na obiekcie zestawu ramek. Będzie musiał usunąć z pojemnika, a następnie ustawić atrybuty, a następnie ponownie dodać do pojemnika. –

To zadziałało dla mnie.Stworzyłem funkcję, która "resetuje" cols, a "później" ustawia poprawne szerokości. Wydaje się, że musi upłynąć limit czasu po zresetowaniu lub rodzaj pętli, która "dotyka" ramek potomnych

function init_page() { 
    function setCols(frms, cols) { 
    // for some magic reason we have to 1st -> reset current cols 
    frms.setAttribute('cols', ''); 
    // and 2nd ask about child width (it's now clientWidth) 
    for (var i = 0; i < frms.children.length; ++i) { 
     if (frms.children[i] && (typeof frms.children[i].clientWidth != "undefined" || typeof frms.children[i].width != "undefined")) { 
     } 
    } 
    frms.setAttribute('cols', cols); 
    } 
    // Minimize frame button 
    $('#minimizeButton') 
    .toggle(function() { 
     setCols(parent.document.getElementsByTagName('frameset')[0], '50,*'); 
    }, 
    function() { 
     setCols(parent.document.getElementsByTagName('frameset')[0], '50%,*'); 
    }); 
}

Źródło

2016-11-15 10:50:10 akovar

Zestaw ramek nie zmienia rozmiaru poprawnie po zmianie rozmiaru za pomocą myszy

Odpowiedz

Powiązane problemy