Greybox Browser Image ***14/05/11***

BaconFries · Post by **BaconFries** » Thu Jul 29, 2010 10:27 pm

14/05/11
***Update New Build For WB7 only****

***29/07/10***
Meets W3C Standards
Built with Extension Builder 2.0.3

Grey Box Browser Image Extension
This is a simple way to display a external page from your site by simply clicking on a image and it will open in a lightbox style fashion you can add what ever site you wish to be displayed.

Demos at authors site
http://orangoo.com/labs/GreyBox/

Download for Web Builder7.X.X
Only available via extension manager

BaconFries · Post by **BaconFries** » Thu Jul 29, 2010 10:28 pm

Greybox Browser Image ***29/07/10***

BaconFries · Post by **BaconFries** » Fri Jul 30, 2010 9:39 am

Demos at original authors site there is already a text version available since Posted: Wed May 13, 2009 3:28 pm please look here
viewtopic.php?t=19416

BaconFries · Post by **BaconFries** » Sat Jul 31, 2010 10:17 am

You can view demos of how the extension works at the first posting by visting the original author site just click on the provided url below
"Demos at authors site"

This part in red refers to when the first text version was released"Posted: Wed May 13, 2009 3:28" it is not refering to when there was a demo to view...all demo examples are available at the original authors site as previously mentioned .....

BaconFries · Post by **BaconFries** » Sun Aug 01, 2010 10:49 am

There may be a way to do this by adding a extra snippet of code to the source to allow a load event so that the page opens when a user visits the page but at present no it only works when a user clicks on a image or a text link as in previous version...

NigelShaw · Post by **NigelShaw** » Sun Aug 01, 2010 11:33 am

Hi BaconFries

thank you mate

i had done one in a fashion but it was very shady lol

cheers

Nigel

BaconFries · Post by **BaconFries** » Sun Aug 01, 2010 11:45 am

Nae probs "Mate"

is was just a matter of changing a couple of things in the text version gald to have helped....

NigelShaw · Post by **NigelShaw** » Sun Aug 01, 2010 2:18 pm

Hi,

i have found that the link doesnt seem to work. the greybox opens but just goes into the "loading" state with the circular icon but the web page doesnt appear. checking the actual links, they seem to work fine without greybox but not with. Google doesnt work either.

is it something simple im not doing right?

cheers

Nigel

BaconFries · Post by **BaconFries** » Sun Aug 01, 2010 2:37 pm

Hi Nigel please check that you you have not ticked the checkbox in Tools>Options>Micellaneous>Preview>Disable IE security warning during preview having this ticked it seems to block the content in the greybox window...

NigelShaw · Post by **NigelShaw** » Sun Aug 01, 2010 3:07 pm

Hi BaconFries

i have looked and it is not checked. it works when i use the original version that has the text to click but not with the image.......

strange behaviour lol

Nige

BaconFries · Post by **BaconFries** » Sun Aug 01, 2010 6:24 pm

Hi Nigel I can confirm it is a bug with "Google Chrome" the extension seems to work once uploaded to a server it just wont display in "Preview"
I have also checked it in FF, Safari, Opera, IE6/7/8 and it opens as it should in "Preview" so it seems it just "Google Chrome" being a pain in the a** I will rey and cotact the autor and see what hes says....

BaconFries · Post by **BaconFries** » Sun Aug 01, 2010 6:28 pm

@ haamster here is the code you need to open in a window when user visits your page to insert this open Page Properties and place in Between <head></head> change the "Tiltle" and "url" to the same used in the extension properties...

Code: Select all

<script type="text/javascript">
AJS.AEV(window, 'load', function() {
          GB_showPage("Title", "url");
     });
</script>

NigelShaw · Post by **NigelShaw** » Mon Aug 02, 2010 11:35 pm

Hi BaconFries

Would it be possible to add the greybox display options into the extension or post the source so I could do it? I've been playing with extensions again and got my head back into gear after a long time away lol.

I prefer the "gb_page_fs" as it takes away the ugly top banner.

Regs

Nigel

NigelShaw · Post by **NigelShaw** » Tue Aug 03, 2010 12:18 am

Hi

Well I've added the greybox options to one I have made but need to ask some advice questions.

On your extension baconfries, you see the image in the design screen. How do you do that?

How do you get the image to stay in the place you put it in the design window? Mine keeps going to the top left of the screen.....

Other than that, it works great lol

Thanks

Nigel

BaconFries · Post by **BaconFries** » Tue Aug 03, 2010 10:14 am

Hi Nigel OK first question....

NigelShaw wrote: On your extension baconfries, you see the image in the design screen. How do you do that?

Answer
Design time rendering use "Live HTML rendering"

Second question....

NigelShaw wrote: How do you get the image to stay in the place you put it in the design window? Mine keeps going to the top left of the screen.....

Answer
General uncheck "Use DIV container" we need to add a new <div></div> to the HTML and add a variable/property this is from the GB image so we can use Image1, Image2, etc etc...
<div id=" wb_$imageid$" style="overflow:hidden;position:absolute;left:$LEFT$px;top:$TOP$px">
<a href="$website$" title="$title$" rel="gb_pageset[search_sites]">
<img src="$image$" alt="$alt$" id="$imageid$" border="$bsize$" style="width:$width$px;height:$height$px;border:$bsize$px $color$ $style$;z-index:$z-order$"/></a>
</div>

Hope this helps...

NigelShaw · Post by **NigelShaw** » Tue Aug 03, 2010 5:16 pm

Hi BaconFries,

i have a question regarding the Greybox. When i add your extension and preview it, it works fine. When i add mine, it doesnt work at all. if i add yours onto the page where mine is, mine works and then if i remove yours, mine stops working again.

when i test my extension in the builder, it works fine.

when i check the preview folder in 'temp' on your extension, the greybox files are there. when i check the same folder on my extension, its empty!

any ideas?

i have included all files in the correct way using the builder....

thanks

Nigel

BaconFries · Post by **BaconFries** » Tue Aug 03, 2010 5:53 pm

Hmm hard to say.. if you want I can take a look at it see what may be wrong you would ned to upload it somewhere like mediafire and I will view it ...

NigelShaw · Post by **NigelShaw** » Tue Aug 03, 2010 7:54 pm

Hi

I'll upload it first things bacon along with the prettySociable extension I made.

Cheers pal

Nigel

NigelShaw · Post by **NigelShaw** » Wed Aug 04, 2010 2:03 pm

Hi BaconFries

here is the source file for my version of Greybox extension

http://www.mediafire.com/?za723k8v02x93ii

thanks for looking

cheers,

Nigel

BaconFries · Post by **BaconFries** » Wed Aug 04, 2010 2:42 pm

Will get a look at this for you later this evening and let you know..

BaconFries · Post by **BaconFries** » Wed Aug 04, 2010 10:18 pm

Hi Nigel ok got a look and I can see what is wrong it probally might be easier to explain via a email I can post here what I see to be wrong if you prefer.....

NigelShaw · Post by **NigelShaw** » Wed Aug 04, 2010 10:32 pm

Hi BaconFries

I think I figured it about 5 minutes ago.

The embedded files had been moved so they weren't available when published. I updated the file locations and currently it's working.

Is that what you found?

Cheers

Nigel

BaconFries · Post by **BaconFries** » Wed Aug 04, 2010 10:41 pm

No I found that you hadnt used the same HTML and also found double code that may cause errors...

This is how I use mine using the (rel="gb_pageset[search_sites]")
<a href="$website$" title="$title$" rel="gb_pageset[search_sites]">
<img src="$image$" alt="$alt$" id="$imageid$" border="$bsize$" style="width:$width$px;height:$height$px;border:$bsize$px $color$ $style$;z-index:$z-order$"/></a>

If you look at yours you will see that you are calling two (rel="gb_page_center[1200, 650][search_sites])
<a href="http://www.google.com" title="Google" rel="gb_page_center[1200, 650][search_sites]">
<img src="images/shop-aveda-logo.gif" alt="tester" id="$imageid$" border="0" style="width:170px;height:48px;border:$size$px #000000 dotted;z-index:0"/></a>

Were it should be
<a href="http://www.google.com" title="Google" rel="gb_page_center[1200, 650]">
<img src="images/shop-aveda-logo.gif" alt="tester" id="$imageid$" border="0" style="width:170px;height:48px;border:$size$px #000000 dotted;z-index:0"/></a>

NigelShaw · Post by **NigelShaw** » Thu Aug 05, 2010 2:03 am

Hi BaconFries

I couldn't find the code

When I looked at the HTML in the source extension, there was only 1 line of code. I can only think I posted an older one with trials. Mine works fine now ( well nearly fine )

In some instances, I can add the extension to the web page it see it clearly but, when I preview it the image flashes then disappears.....

As soon as I have this bit fixed, I'll post it up with the selectable versions

Cheers

Nigel

NigelShaw · Post by **NigelShaw** » Fri Aug 06, 2010 6:54 pm

Hey Bacon

There is a snag with both yours and my extension. On my page I have a standard navigation menu horizontal with White text and clear background. When the greybox is used, the menu appears on top of the greybox screen. I can't get rid of it so wondered what nay be causing it.

Any ideas?

Nigel

BaconFries · Post by **BaconFries** » Fri Aug 06, 2010 9:46 pm

Hi Nigel hmmm just checked my version with a transparent menu and it seems to be ok...I did try yours and the menu does appear on top of the lightbox....Now if I add my version to page and add yours then both work as they should the overlay covers the menu...

But f I add yours to page first then mine and test then the menu gets place on top of the overlay...with both images

I have uploaded two demo urls made of your version and mine
I have added the same rel="" for both just to show them working using exactly the same properties... if you take a closer look at my extension version you will see that I have added a property for increasing the index order so that you can bring the overlay to the top so that it covers anything like menus images etc etc were in your version you dont have this option to increase the z-index order...

BF
http://justtesting123.comuf.com/bf/index.html
NS
http://justtesting123.comuf.com/ns/index.html

NigelShaw · Post by **NigelShaw** » Fri Aug 06, 2010 10:32 pm

Hello mate

What's the missing setting? I've looked at your extension vs mine on page source and I see an extra line but nothing that resembles the settings for Z order. I added the line so it looks just like yours but my menu is still on top....

Cheers

Nigel

BaconFries · Post by **BaconFries** » Sat Aug 07, 2010 12:53 am

Hi Nigel download and replace the gb_styles.css in the extension with the modified one in the zip file...I had forgotten that this was modified till I looked at your files in preview folder....

and saw the lower z-index settings...credits go out to Eddy for this mod as he provided it last year when I made all the greybox extension then....

http://www.mediafire.com/?zivyb9o5phv8svs

BaconFries · Post by **BaconFries** » Thu Oct 21, 2010 7:19 pm

21/10/10
***Update New Build For WB7 only****

BaconFries · Post by **BaconFries** » Sat May 14, 2011 3:17 pm

Greybox Browser Image ***14/05/11***

www.wysiwygwebbuilder.com

Greybox Browser Image 14/05/11

Greybox Browser Image 14/05/11

Re: Greybox Browser Image 21/10/10

Re: Greybox Browser Image 14/05/11

Greybox Browser Image ***14/05/11***

Greybox Browser Image ***14/05/11***

Re: Greybox Browser Image ***21/10/10***

Re: Greybox Browser Image ***14/05/11***

Greybox Browser Image 14/05/11

Greybox Browser Image 14/05/11

Re: Greybox Browser Image 21/10/10

Re: Greybox Browser Image 14/05/11