Bramblz
Member
Posted 10 months ago #
Hello,
I have Lightbox Plus installed and it is working well with image links.
Now I am trying to add multiple Flash popups, so I started using the Secondary Lightbox features in the plugin.
I was able to adjust the popup size in the settings area, but the problem is I have different sized Flash animations that I want to show in the popups.
Is there only one size for the Secondary Lightbox?
Is there a way, using Lightbox Plus (with or without Secondary Lightbox features) to use control different sizes of Flash popups.(images are working great sizing automatically)
Thanks = )
Bramblz
Member
Posted 10 months ago #
Looks like you have to go into the "Lightbox Plus" plugin settings then:
Go to "Enable Optional/advanced Settings"
Select "Use Secondary Lightbox"
Add a number of "Inline Lightboxes" with the dropdown,
Then you set the height width each of the new "Inline Lightboxs"
Then you call each of the new Inline Lightbox with a different button script eg:
(a class="lbp-inline-link-1 cboxElement" href="#")Inline Lightbox 01(/a)
Replace brackets with these <>
And add this code for what opens:
<div style="display: none;">
<div id="lbp-inline-href-1" style="padding: 10px; background: #fff;">
INLINE CONTENT GOES HERE</div>
</div>
Bramblz
Member
Posted 10 months ago #
New Problem...
Iframe in "Lightbox Plus" is showing only like 1/3 of the content height,around 250px instead of about 600px height.
Any suggestions?
Bramblz
Member
Posted 10 months ago #
Well using the Firefox plugin called Firebug I found that even though my styles were set to 100%, it was not styling right.
Style:
#cboxLoadedContent iframe {
border: 0 none;
display: block;
height: 100%;
width: 100%;
}
But under the 'Computed' tab I found this:
Box Model
width 686px
height 150px
How can I fix this?
Thanks,
Bramblz
Member
Posted 10 months ago #
This worked for me:
<div style="display: none;">
<div id="lbp-inline-href-1" style="padding: 10px; background: #fff;">
<iframe src="http://www.google.com" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:500px;width:700px;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="500px" width="700px"></iframe>
</div>
</div>
But if you set all to 100%, the iframe will cover the button and title on the bottom.
If there is a solution to this 100% issue please post it here,
Thanks,
[Please post code snippets between backticks or use the code button.]
