Dlaczego nie działa scrolling="no"

pytanie zadane 1 stycznia 2016 w HTML i CSS przez Paweł123 Nałogowiec (33,500 p.)

     <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d312776.9797716396!2d20.78100840854629!3d52.23302685949979!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x471ecc669a869f01%3A0x72f0be2a88ead3fc!2sWarszawa!5e0!3m2!1spl!2spl!4v1451656289681" width="600" height="450" frameborder="0" style="border:0" allowfullscreen  scrolling="no" </iframe>

2 odpowiedzi

odpowiedź 1 stycznia 2016 przez ScriptyChris Mędrzec (190,190 p.)
wybrane 1 stycznia 2016 przez Paweł123

Najlepsza

Sprawdź czy dobrze to zapisałeś - z tego co widzę, to nie domknąłeś znacznika ">", przed </iframe>.

Poza tym użyj CSS do tego, zamiast HTML - co tylko możesz stylizuj w CSS.

komentarz 1 stycznia 2016 przez Paweł123 Nałogowiec (33,500 p.)

Poprawiłem i nadal nie działa :( Może wiesz co można jeszcze zrobić, aby uzyskać taki efekt jak na tej stronie http://podaniolami.com/kontakt.php (chcodzi o mapkę)?

komentarz 1 stycznia 2016 przez ScriptyChris Mędrzec (190,190 p.)

Próbowałeś zrobić to przez CSS? Coś takiego

http://stackoverflow.com/questions/18470015/html5-iframe-no-scrolling

http://help.simplytestable.com/errors/html-validation/the-x-attribute-on-the-y-element-is-obsolete-use-css-instead/the-scrolling-attribute-on-the-iframe-element-is-obsolete-use-css-instead/

komentarz 1 stycznia 2016 przez Paweł123 Nałogowiec (33,500 p.)

Tak, już próbowałem i nadal nie działa.

Masz jeszcze jakiś poradnik?

komentarz 1 stycznia 2016 przez ScriptyChris Mędrzec (190,190 p.)

Największy poradnik ;) https://www.google.pl/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=iframe%20noscroll%20html%20css

Co chcesz zrobić z tym scrollem? Wyłączyć go w mapie, aby podczas przewijania strony mapka się nie zoomowała?

komentarz 1 stycznia 2016 przez Paweł123 Nałogowiec (33,500 p.)

No tak, ale nie wiem jak. Od wczoraj już się z tym męczę :(

komentarz 1 stycznia 2016 przez ScriptyChris Mędrzec (190,190 p.)
edycja 1 stycznia 2016 przez ScriptyChris

Spróbuj tak http://stackoverflow.com/questions/29146888/disable-scrolling-zoom-in-google-maps-iframe

Wyłączasz na elemencie mapy reakcje na myszkę.

Albo JavaScriptem wychwyć zdarzenie scrolla https://developer.mozilla.org/en-US/docs/Web/Events/wheel na tym elemencie i spróbuj wykonać return false lub coś aby wyłączyć reakcję na kółko myszki na tej mapce.

Tą mapę masz z Google Maps API? Bo w linku widać, że masz google.com/maps.

[edit]

Próbowałeś dodać w <iframe> atrybut onmousewheel="" albo onwheel="" - czyli brak reakcji na kółko myszki z "poziomu" HTML?

komentarz 1 stycznia 2016 przez Paweł123 Nałogowiec (33,500 p.)

Ok, dzięki :D jakiś cudem zrobiłem to co chciałem :D

Jeszcze raz DZIĘKI ZA POMOC :D

komentarz 1 stycznia 2016 przez ScriptyChris Mędrzec (190,190 p.)

Która opcja rozwiązała problem?

komentarz 1 stycznia 2016 przez Paweł123 Nałogowiec (33,500 p.)

Sam nie wiem, wszystko co dałeś to przeczytałem i poszukałem w internecie troszkę i znalazłem coś takiego.

<!DOCTYPE html>
<html>
<head>
<style>
    .scrolloff {
        pointer-events: none;
    }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
    $(document).ready(function () {
        $('#map').addClass('scrolloff');                // set the mouse events to none when doc is ready
        
        $('#overlay').on("mouseup",function(){          // lock it when mouse up
            $('#map').addClass('scrolloff'); 
            //somehow the mouseup event doesn't get call...
        });
        $('#overlay').on("mousedown",function(){        // when mouse down, set the mouse events free
            $('#map').removeClass('scrolloff');
        });
        $("#map").mouseleave(function () {              // becuase the mouse up doesn't work... 
            $('#map').addClass('scrolloff');            // set the pointer events to none when mouse leaves the map area
                                                        // or you can do it on some other event
        });
        
    });
</script>
</head>
<body>
<div id="overlay" class="map">
    <iframe id="map" src="https://www.google.com/maps/embed/v1/place?key=AIzaSyCjUE83FHrXTQWf9umcNDzyu0s7aNzHszw
    &q=Space+Needle,Seattle+WA" width="100%" height="500" frameborder="0" ></iframe>
</div>

</body>
</html>

komentarz 1 stycznia 2016 przez ScriptyChris Mędrzec (190,190 p.)

Sporo kodu jak na wyłączenie jednego Eventu :) Nie działało po prostu wyłączenie zdarzenia kółka myszki typu onwheel="". Albo "na czysto"

var mapa = document.getElementById('map');
mapa.addEventListener('mouseover', function()
{
  mapa.removeClass('scrolloff');
}

Jeśli nie pomieszałem klas, to w momencie gdy najedziesz myszką na mapę, to powinien się wyłączać scroll. Można pójść dalej i w momencie gdy najedziesz myszą - zdarzenie 'mouseover' - to powyłączać wszystkie reakcje myszki. I to zrobiłeś z jQuery, tylko dużo eventów powstało. Zastanawiam się czy jest sens aż tyle tego pisać.

Ale ok, jeśli działa, to najważniejsze :)