Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • April 15, 2014 at 5:06 pm #251699
    akaracing

    hi

    i have a question about the toggler container.

    on my site i have a single accordion/toggler which displays a table.

    the toggler container calls the table up with an iframe which works very well if you set the height of what the contents will be, but if you set the height to 100% it cuts the table short. this only happens in FF, Crome & IE on pc’s or laptops. but works great with iphones, ipads & andriods.

    can you tell me why this happens.

    the site is http://f1xx.com

    the toggler in question is call “Formula 1 – Race Calendar 2014”

    the content of table call the data from a small data base, this table get amended after each race, so it grows in length so to have the toggle container be dynamic would help as i would have to change the iframe height every time.

    thanks

    April 16, 2014 at 2:48 am #251897
    Ismael

    Hi Aleks!

    Thank you for using the theme!

    Since wp is using the wpautop function, it is generating a p tag around the iframe tag. Please add this on Quick CSS or custom.css:

    .js_active .toggle_content p {
display: block;
height: 100%;
}

    I hope that helps.

    Cheers!
    Ismael

    April 16, 2014 at 12:26 pm #252046
    akaracing

    hi

    thanks for the update,

    i tried the recommendations above, but they course some strange things to happen:
    1. seems to work with crome
    2. dosent work with ff
    3, it make the toggle contain endless on iphone and ipad

    i also tried it with a <div> also with <object & <embed

    is there ant thing else i can try??

    cheers

    ak

    April 16, 2014 at 4:17 pm #252179
    akaracing

    hi

    after further investigation, if i leave the 100% off from your css instruction, the ipad and iphone options work.(responsive mode), but on laptop/pc it only shows the default iframe size.

    you can check this out http://www.f1xx.com
    I also tried it with a textbox and get the same results.??

    Any ideas

    Regards
    Aleks

    April 17, 2014 at 9:43 am #252533
    Ismael

    Hi!

    Thank you for the update.

    I’m sorry but the only solution that I can think of is to specify an actual height for the container:

    .js_active .toggle_content p {
    height: 700px;
}

    Best regards,
    Ismael

    April 17, 2014 at 1:02 pm #252649
    akaracing

    Hi

    I have done that and that works, it’s the same as if i set the iframe height. I surprised that you can’t see when the problem is, maybe you can hand it over to someone who knows that area of code. This is quite a prblems as there will be mainy tables on the site and ive have to set the iframe height for each one of them.

    kind regards

    Aleks

    April 21, 2014 at 5:44 pm #253948
    Devin

    Hi!

    Dynamic heights in web development is a tricky topic but its also not something that theme support covers since its content customization specific to your individual setup.

    Best regards,
    Devin

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.