iframe автоматически прокручивается вниз - как его инициализировать прокручивать вверх? - PullRequest
0 голосов
/ 21 сентября 2018

У меня есть аккордеон пользовательского интерфейса, который содержит различные Ифрамы.Первый Ифраме в порядке и не требует никаких изменений, но когда я открываю второй заголовок аккордеона, Ифраме, содержащийся внутри, инициализируется, прокручивается до нижней части страницы.Я хотел бы, чтобы меня прокручивали наверх, но я не уверен, как туда добраться.Это делается в Razor, поэтому не обращайте внимания на синтаксис @, который вы видите.

<div id="reports-accordion">
    <h1>Trend Report</h1>
    <div id="powerbireport">
        <iframe src="https://app.powerbi.com/view?##########" frameborder="0" allowFullScreen="true"></iframe>
    </div>
    <h1>Density Estimations</h1>
    <div>
        <p>
            James' Content
        </p>
        <button type="button" id="graphDwnld">Download Graph JPEG</button>
        @if (state == "AR")
         {
            <div>
                <iframe src="~/Content/DataVizByState/AR_Analysis_2018.pdf#zoom=100"></iframe>
            </div>
         }
         <!--Conditional continues-->
     </div>
</div>

CSS

#reports-accordion {
    margin-top: 30px;
    background-color: white;
}

#reports-accordion h1{
    font-size: larger;
    font-weight: bold;
}

#reports-accordion .ui-accordion-header.ui-state-default {
    background: rgb(82, 151, 95);
    color: white;
}

#reports-accordion .ui-state-default .ui-icon {
    background-image: url(../Content/img/ui-icons_ffffff_256x240.png);
}

#reports-accordion .ui-state-hover .ui-icon,
#reports-accordion .ui-state-active .ui-icon {
    background-image: url(../Content/img/ui-icons_050505_256x240.png);
}

#reports-accordion .ui-accordion-header.ui-state-hover, 
#reports-accordion .ui-accordion-header.ui-state-active{
    color: black;
}
iframe {
width: 100%;
height: 70vh;
display: block;
}

JS

$(document).ready(function () {
    $("#reports-accordion").accordion({
        collapsible: true,
        active: false,
        heightStyle: "content"
    });
});

Библиотека пользовательского интерфейса

<script src="~/Scripts/jquery-ui-1.11.4.js"></script>

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...