Question

我将此手风琴脚本用于常见问题解答页面：http://www.snyderplace.com/demos/accordion.html

除了一个在移动设备上特别明显的问题外，它很棒。当您点击某个问题并且其中包含大量内容时，它会向上展开屏幕，向上滚动以查看问题和内容的开头。

理想情况下，当您点击它时，我希望将脚本滚动到页面顶部/视口的位置。如果有人知道在脚本中调整什么会令人惊讶！

Answer 1

您可以尝试这样的事情。你不需要手风琴插件：

带有图标的编辑版本，默认打开，启用触摸滚动到顶部

https://www.nuget.org/packages/DotNetZip/

将班级节目添加到您要打开的班级。

这可能会因为重复代码而更有效地编写，但它应该有效。

的jQuery

<div class="accordion">Heading<span></span></div>
    <div class="container">
        <div class="content">
            <div>Sample Content</div>
            <p>Content here....</p>
        </div>
    </div>
<div class="accordion">Heading<span></span></div>
    <div class="container">
        <div class="content">
            <div>Sample Content</div>
            <p>Content here....</p>
        </div>
    </div>
<div class="accordion show">Heading<span></span></div>
    <div class="container">
        <div class="content">
            <div>Sample Content</div>
            <p>Content here....</p>
        </div>
    </div>
<div class="accordion">Heading<span></span></div>
    <div class="container">
        <div class="content">
            <div>Sample Content</div>
            <p>Content here....</p>
        </div>
    </div>

HTML

public class PdfHelper : PdfPageEventHelper
{

    public string HeaderPhrase { get; set; }


    public PdfHelper (string headerPhrase)
    {
        HeaderPhrase = headerPhrase;
    } 

    public PdfHelper ()
    {

    }

    public override void OnEndPage (PdfWriter writer, Document document)
    {
        PdfPTable table = new PdfPTable(1);

        table.TotalWidth = document.PageSize.Width - document.LeftMargin - document.RightMargin; 
        PdfPTable table2 = new PdfPTable(2);
        table.DefaultCell.Border = Rectangle.NO_BORDER;
        table2.DefaultCell.Border = Rectangle.NO_BORDER;


        var p = new Phrase(HeaderPhrase);
        p.Font = new Font(Font.FontFamily.HELVETICA, 20);
        PdfPCell cell2 = new PdfPCell(p);
        cell2.Colspan = 2;
        cell2.Border = Rectangle.NO_BORDER;
        cell2.HorizontalAlignment = Element.ALIGN_RIGHT;
        table2.AddCell(cell2);

        PdfPCell cell = new PdfPCell(table2);
        cell.Border = Rectangle.NO_BORDER;
        table.AddCell(cell);



        table.WriteSelectedRows(0, -1, document.LeftMargin, document.Bottom, writer.DirectContent);
    }
}

请注意，您需要在代码中包含jQuery。

Jquery手风琴 - 点击元素滚动到页面顶部

1 个答案: