WebsiteBaker Community Forum (upd)

Hi there!

For all non-german-speaking users:

I would like to inform You that Maruk made a new snippet, called Fancy-Box.
See the Website here. (http://fancy.klade.lv/)

Here is the original thread (https://forum.websitebaker.org/index.php/topic,11159.msg67175.html#msg67175) in german.

With this package You are able to use this amazing script in any page You like. Just download and install as usual in WB. On the page wehre You want to use it, set a section code and call the function. That´s it.
For the design and saving space I modified the code-appearence. See the screenshot.
I included the modified file. Just copy the modify.html to the folder modules/code in Your server and You are done. This will change the code-section to a single-line-view, but not affect any code, if in use somewhere in Your site. - For further code sections with more lines You should use CODE2 - if You don´t have it already, download it here (http://websitebaker.at/wb/module.html).

There are 5 classes already predifined:

fb - use fancy-box with standard-values
pic_fb - for pictures, closing on klick into the pic or cross
pic1_fb - for pictures, closing on klick into the pic or cross, darkens the background
page_fb - for urls, closing only with click on the cross, some pages braek out when surfing, some stay in
video_fb - set link to anchor, size predifined to 425 x 355 px

and further more, there is a sample-configuration for a <div id="use_fb">
all links innert this <div> will be displayed by Fancy-box, no matter if class is set or not. The default-configuration will be used (size, effect) - if You want specific effects, use classes. Or make Your own configuration in the include.php

For now I didnot make display-groups, for "surfing" the links, but this is also possible.

More configurations can be stored in the include.php

Example how to use to display a YouTube-video:

The first section of the page must be type CODE - in this section write

use_fancy_box();

and save. In a wysiwyg-section add a link.
Add the corresponding class to the link.
Code:

<a class="video_fb" href="#testube">See this video</a>

save. Add a further section - type CODE2, set it to html and insert the following code

<div style="display: none;" id="testube" />
<object height="355" width="425" />
<param name="movie" value="http://www.youtube.com/v/nnpv3FhIVXk" />
<param name="wmode" value="transparent" />
<embed height="355" width="425" src="http://www.youtube.com/v/nnpv3FhIVXk" type="application/x-shockwave-flash" wmode="transparent" />
</embed></object>
</div>

and save. Finished.


Example how to use fancy-box with an image-link:

The first section of the page must be type CODE - in this section write

use_fancy_box();

and save. In a wysiwyg-section add a link.
Add the corresponding class to the link.

<p><a href="http://localhost/wb/media/testfotos/kugelsunsetglow.jpg" class="pic_fb"><img height="171" border="0" width="200" src="http://localhost/wb/media/testfotos/Bar_kl.jpg" alt="" /></a></p>

save. Finished.


regards from Himberg, next to Vienna

[gelöscht durch Administrator]

[gelöscht durch Administrator]

Cool! Thanks  :-D

I wonder... this would be nice to use together with the News module as well. Click on a title link, and the complete news item pops up. Would this be possible to do somehow?

Hi Argos,

Yes, no problem.

Just try it out.

Create a usual link (<a href="http://DOMAIN/pages/news.php" class="seite" >News</a>), activate FB as explained, and the news are shown in a Box.

As long as You read the news, even You follow links, it stay´s inside this box. If You click annother menu-link, the box dissapears. (Because of the framebraking feature of WB I think)

regards from Himberg

I am not very happy with the class names.

they should be something like "fb_mode1" or "fb_page"
Why not use the original names?

There might be classes like "bild" in templates allready and - of course - "bild" is quite german.

Jo, chio
however - You could change this to whatever You like in the include.php.

If german or not - "bild" will be in classes only, if someone uses german.


Annother example (http://edv.spoka.at/pages/fancy-box.php) for fancy-box combined with anynews

Just be creative and share Your results.


regards from Himberg

Quote from: vyni on October 10, 2008, 08:55:19 AM
Annother example (http://edv.spoka.at/pages/fancy-box.php) for fancy-box combined with anynews

Hi vyni,

this shows the complete site in a popup, but I meant to show only the long content of the news item  :roll:
Do you know how to do that?

Quote from: Argos on October 10, 2008, 10:53:36 AM
this shows the complete site in a popup, but I meant to show only the long content of the news item  :roll:
Do you know how to do that?

Use a blank template for the newspage?

@vyni

I installed the snippet and like it :-)
I put it on a new customer website, and the site didn't show anymore :-(

I will try to explain what happened:

The snippet start with a blank line before the <?php
This causes WB to send data (a blank line) before a page is ever built.
My customers website starts with a menu-link page that executes a redirect to the /nl/ pages.
The redirect failed because PHP said that there was already data being sent.
The production site has PHP errors off, so all I got was an empty page.

Solution, always make sure that snippets have no data between outside <?php and ?>

Ruud

Thank You, Mr. Ruud

for making me a little bit more clever.  :-D

This only could happen, because Maruk isn´t that experienced in making snippets or modules. Me for myself, I don´t even understand the differnce between snippet and modul. I´m just a helping hand.

But now I am appeased, because You had a look on it.
I will clean up and renew the description, also using more FB-specific class-names as chio propound.

At least - this is really a very very nice thing.

@Argos
Ruud had the answer - for the news itself use a blank template and put them on a hidden page. Create a normal page type code and use the snippet anynews for displaying the overview and extend the include.php as described. The resullt will be what ever You want. See a Demo (http://edv.spoka.at/pages/news.php)

regards from Himberg

Hi all,

and again, a blind man talking about colors.  :-D

I love the fancy-box, but I also whant to get valid pages. here is, how it works for me:

I took this
<link rel="stylesheet" href="<?php echo WB_URL; ?>/modules/fancy_box/box/fancy_css.php?wbp=<?php 

echo WB_URL; ?>" type="text/css" media="screen" />
from the include.php of the modul to the index.php of my template.

And then I changed the syntax in the inlude.php here and there a little bit
<?php
$debug = false;
if (true == $debug ) {
    ini_set('display_errors', 1);
    error_reporting(E_ALL);
}
if (!function_exists("use_fancy_box") ) {
    function use_fancy_box() {
    ?>
   <script language="JavaScript" type="text/javascript" src="<?php echo WB_URL; ?

>/modules/fancy_box/box/jquery.js"></script>
    <script language="JavaScript" type="text/javascript" src="<?php echo WB_URL; ?

>/modules/fancy_box/box/jquery.fancybox.js"></script>
    <script language="JavaScript" type="text/javascript" src="<?php echo WB_URL; ?

>/modules/fancy_box/box/jquery.pngFix.js"></script>
     
    <script language="JavaScript" type="text/javascript">
    $(document).ready(function() { $("a.fb").fancybox();
    $("a.page_fb").fancybox({ 'hideOnContentClick': false,
                            'zoomSpeedIn':0,
                               'zoomSpeedOut':300 });
    $("a.pic_fb").fancybox({ 'hideOnContentClick': true });
    $("a.pic1_fb").fancybox({ 'hideOnContentClick': true,
                            'overlayShow': true });    
    $("a.video_fb").fancybox({ 'overlayShow': true,
                               'frameWidth': 425,
                               'frameHeight': 355 });
    $("div#use_fb a").fancybox();
    });
    </script>
    <?php
    }
}
?>

The result is "This document was successfully checked as XHTML 1.0 Transitional!"  :-D

Great,

have You tested it in google-chrome?

It isn´t working for me right now.
Do You have an url where to see ??

But remember: If You call it directly from the template - You will get troubles with one or annother modul! Maybe Lightbox, maybe Imageflow, maybe annother?

regards from Himberg

Hi vyni,

you got a pm.

Great - it works in chrome!

I use Lightbox2 on the second page of the site "aufteilung..." and there seem to be no problems.

Quote from: vyni on October 11, 2008, 03:15:14 PM
But remember: If You call it directly from the template - You will get troubles with one or annother modul! Maybe Lightbox, maybe Imageflow, maybe annother?

Just forgotten,

the general solution for that is the use of a frontend.css, as matthias tould you in the german thread about fancy-box.

Regards

Uwe (going to eat now)

Hi Vyni,

one question. I tested fancybox successfully with "Code". You prefer "Code2". What is the reason?

Thanks in advance!

Uwe

Edit: and a second qustion. I had a closer look at fancybox in Opera and the effect was different from IE and FF3. The popups are opening in a different position, much closer to the bottom.  :?
My changes or the js or opera?

Edit01: I tried the examples at http://fancy.klade.lv/ (http://fancy.klade.lv/) in Opera and none of them is working in Opera.  :oops:

Quote from: albatros on October 11, 2008, 04:41:51 PM
Hi Vyni,

one question. I tested fancybox successfully with "Code". You prefer "Code2". What is the reason?

Thanks in advance!

Uwe

Edit: and a second qustion. I had a closer look at fancybox in Opera and the effect was different from IE and FF3. The popups are opening in a different position, much closer to the bottom.  :?
My changes or the js or opera?

Edit01: I tried the examples at http://fancy.klade.lv/ (http://fancy.klade.lv/) in Opera and none of them is working in Opera.  :oops:

Edit2: WHAT is that? The are working, but they are opening much, much deeper, much closer to the bottom of the (long) page. So you only can see them, when you are scrolling down. Mysterios!

Hi Albatros,

For the issue in opera: I really don´t have a clue. But there are a lot more browsers out there....
And if there is something in the "owners-page", than I guess, it is something with the Javascript itself. Or just a failure from opera. Who know´s?

:lol: I´m thinking of a script which identifies the browser and in case it isn´t FF or IE there must be a big red line saying:

And the difference between code and code2:, or why I prefer to use code2 and use code rarely:

code2 has the option to set the mode, if html, javascript, php or just internal comment. So You have always clear which code You are using. Also it is a superb way to give some help and explanation to unexperienced users. If You want to comment a section or just write down the different parameters which could be set, this is perfect.
And this module I use very often - unchanged - full sized. But when You need a section code for only one line, for anynews or fancy_box or whatever, I was fed up of the space-wasting textarea. So I modified the output of this code-module. Now I´m happy with the look and feel of the backend, use it when I need only one line and prefer code2 for all other needings.

regards from Himberg

hi all,

i've a short question for the fancy box...

are there any minimum requires on the webserver to run it...

for my projekt it runs on XAMP... it runs on vynis server....with my template!

but it doesn't run under my webserver (different templates, anynews is correct configuered?)

are theire any serverside settings what can dissable the fb???

regards martin

edit here is the link to the example video from the threat : http://start.mr-vilsbiburg.de/pages/fb-test.php (http://start.mr-vilsbiburg.de/pages/fb-test.php)

Quote from: vyni on October 11, 2008, 03:26:31 PM
Great - it works in chrome!

I think there are some troubles in the new version of Chrome. I've got this
$(document).ready(function() { $("a.fb").fancybox(); $("a.page_fb").
fancybox({ 'hideOnContentClick': false, 'zoomSpeedIn':0, 'zoomSpeedOut':300 });
$("a.pic_fb").fancybox({ 'hideOnContentClick': true });
$("a.pic1_fb").fancybox({ 'hideOnContentClick': true, 'overlayShow': true });
$("a.video_fb").fancybox({ 'overlayShow': true, 'frameWidth': 425, 'frameHeight': 355 });
$("div#use_fb a").fancybox(); });

Strange...

Grtz,
Luc

Hi Luckyluke!
I have the same problem! Maybe you have a solution ? I´ve tried to put the code into head-no chance but i have to say that i´m not sure if i have done it in the right way.
This site http://www.rvb.bplaced.net/pages/fancy.php (http://www.rvb.bplaced.net/pages/fancy.php) works fine in chrome altough there are error messages in the javascript console. Code is in body!

best regaard
peter

hab die include so abgeändert (<script---/></script -> <script></script)
<?php
$debug = false;
if (true == $debug ) {
    ini_set('display_errors', 1);
    error_reporting(E_ALL);
}
if (!function_exists("use_fancy_box") ) {
    function use_fancy_box() {
    ?>
   <script type="text/javascript" src="<?php echo WB_URL; ?>/modules/fancy_box/box/jquery.js"></script>
   <script type="text/javascript" src="<?php echo WB_URL; ?>/modules/fancy_box/box/jquery.fancybox.js"></script>
   <script type="text/javascript" src="<?php echo WB_URL; ?>/modules/fancy_box/box/jquery.pngFix.js"></script>
    <link rel="stylesheet" href="<?php echo WB_URL; ?>/modules/fancy_box/box/fancy_css.php?wbp=<?php echo WB_URL; ?>" type="text/css" media="screen">
   <SCRIPT type=text/javascript>
   $(document).ready(function() { $("a.fb").fancybox();
   $("a.page_fb").fancybox({ 'hideOnContentClick': false,
                           'zoomSpeedIn':0,
                               'zoomSpeedOut':300 });
   $("a.pic_fb").fancybox({ 'hideOnContentClick': true });
   $("a.pic1_fb").fancybox({ 'hideOnContentClick': true,
                           'overlayShow': true });    
   $("a.video_fb").fancybox({ 'overlayShow': true,
                              'frameWidth': 600,
                              'frameHeight': 400 });
   $("div#use_fb a").fancybox();
   });
   </script>
   <?php
    }
}
?>
in chrome funkts jetzt auch

Hello, I have a question for the fancybox - I am new to javascripting and I am trying to figure out the fancybox. If I want to use more than one Custom defined image set, how do I do that? Can anybody help me please?

I am bugging like this >  :-o

Does anyone have FancyBox working in a WebsiteBaker website?  I had it working a while back, but now when I tried it opens the video frame way down the page, without the lightbox effect.

I have tried un-installing and re-installing, but it won't work anymore.

Hi,

yes I have. E.g. here http://www.willingen-ferienhaus.de/topics/wintersport-in-willingen-3.php (http://www.willingen-ferienhaus.de/topics/wintersport-in-willingen-3.php) and here http://www.willingen-ferienhaus.com/ (http://www.willingen-ferienhaus.com/) you can see it in action, but only with images, not with a video.

Regards

Uwe

Thank you.  Those examples look great, and work perfectly in my browsers.  So I am left to wonder, how you set your fancybox up?

I downloaded the fancybox module from AMASP http://www.websitebakers.com/pages/modules/various/fancy-box.php

Installed the module through WB Add-ons.

I then followed Vyni's (miss you Vyni!) instructions:
-----------------------------------------------
Example how to use to display a YouTube-video:

The first section of the page must be type CODE - in this section write

Code:
use_fancy_box();
and save.

In a wysiwyg-section add a link.
Add the corresponding class to the link.
Code:
<a class="video_fb" href="#testube">See this video</a>
save.

Add a further section - type CODE2, set it to html and insert the following code
Code:
<div style="display: none;" id="testube" />
<object height="355" width="425" />
<param name="movie" value="http://www.youtube.com/v/nnpv3FhIVXk" />
<param name="wmode" value="transparent" />
<embed height="355" width="425" src="http://www.youtube.com/v/nnpv3FhIVXk" type="application/x-shockwave-flash" wmode="transparent" />
</embed></object>
</div>
and save. Finished.
-----------------------

Like I said, I did have this module/snippet working a while ago.  But now it doesn't work.

Can you explain any differences in the way you implemented the module?  Did you make any other manual entries?

Many Thanks!

Hi sky writer,

I tried the quoted code here http://www.willingen-ferienhaus.de/pages/testseite.php (http://www.willingen-ferienhaus.de/pages/testseite.php) and it works in FF, Opera, IE8 and IE7. It's the same code, only another video (one of my favorites  :-D). I will let it stay here temporarily.

The changes I made, you can read in a former posting https://forum.WebsiteBaker.org/index.php/topic,11327.msg68099.html#msg68099 (https://forum.websitebaker.org/index.php/topic,11327.msg68099.html#msg68099) of the same thread.

hth

albatros

Edit: the video doesn't work in IE6 (don't know why in this moment), but the images do.

Hi albatros,

Your video page works for me.

But I tried the changes that you stated in the thread and I still get the video (or images) opening way down at the bottom of the page.  I notice in that same thread that you had this same issue.  Do you remember what was causing this for you?

This is driving me a little mad.

Hi,

sorry! I really forgot that.

At the End of line 145 in jquery.fancybox.js  I changed from "- 40;" to "/ 3;"  so it's now
var itemTop        = viewportPos[3] + Math.round((viewportPos[1] - itemSize[1]) / 2) / 3;

After that, it also worked in Opera.

hth

albatros

Downloaded this fancy box and it's working nicely.

Minor bad thing is that with Opera it opens the image to under the screen if page is longer than screen.
(Seem's like it's always 30% of body height or similiar, so if body is 3000px long, picture goes too down..)

Hi,

did you try my suggestion of the posting before?

Best regards

Uwe

hey there,

is there an approach to get the fancy box snippet not to insert all css / javascript below the <body> tag since this seems not to be valid code anymore?

thanks

Hi,

I have no validation problems, as you can checkout e.g. here http://www.willingen-ferienhaus.de/pages/aufteilung-u.-ausstattung.php (http://www.willingen-ferienhaus.de/pages/aufteilung-u.-ausstattung.php) or here http://www.willingen-ferienhaus.com/ (http://www.willingen-ferienhaus.com/). This is the result of the changes, which I described here https://forum.WebsiteBaker.org/index.php/topic,11327.msg68099.html#msg68099 (https://forum.websitebaker.org/index.php/topic,11327.msg68099.html#msg68099)

hth

Uwe

hi albatros,

sorry i did not read all topics completly. thanks for pointing me to your solution :-)

all the best

i changed the include.php of fancy_box_0.3b. the include is now valid to w3c. have fun. i named it to fancy_box_0.3c.

greets from germany

[gelöscht durch Administrator]

Hi

I reworked the fancy_box to fit the needs of 2.8.
Box now uses the jquery from include_directory and I did some changes on the css file.
This release now needs wb 2.8 as a minimum requirement.

A small tutorial is posted here:
https://forum.WebsiteBaker.org/index.php/topic,11327.msg67934.html#msg67934

The new release and the last for 2.7 can be downloaded on AMASP (http://www.websitebakers.com/pages/modules/various/fancy-box.php).

Instead of a code page (for the box php call) you can use a droplet:
ob_start();
   use_fancy_box();
   $fancy_content = ob_get_contents();
ob_end_clean();

return $fancy_content;
and call it with

Quote[[fancybox]]

It will not be available on the official library (http://www.websitebakers.com/pages/droplets/official-library.php) because it is a function call that needs the snippet fancybox.

rgds

erpe

Nice one, erpe!

Hi,

in the nigthly build Changeset 1164 is a new Version of Fancybox, updated from 1.0 to 1.2.1

Dietmar

On the first look the fancybox doesn't seem to work with the same style as the existing one.
And classes must be modified................
http://www.rvb.bplaced.net/pages/fancy.php

I like the fancybox style as it was.

Why was this updated?

Is it possible to let the old one stay too?

rgds

erpe

Then take the old one in the fancy module folder

Dietmar

Hi Erpe,

what do you have for problems, looks good on your side

here is the expample side from the author

http://fancybox.net/example (http://fancybox.net/example)

Dietmar

QuoteThen take the old one in the fancy module folder

That was why I reworked the module.
Don't want to have the same file twice on different places.

Who decides if a file will be updated or not?

Why is this new js-file needed?

erpe

@erpe: on your page only works youtube-link, but it dont play...

It's normaly that old files will be going updated to the newst one, if there are extended and added options. If you have problems zip the fancybox folder, send it here and i will be going to help you.

Dietmar

@dbs

Quoteon your page only works youtube-link, but it dont play...

i think there is a wrong usage and implatations

Dietmar

@dietmar:

wtf is a nighly build and where is it to find?
u make nightshifts for wb?  :-D

dbs

This are the changes for the new fancybox

    *  Changed grouping, from now groups will be created using "rel" tag (as in first version)
    * Content now is also iframed when anchor has class "iframe"
    * New callback "callbackOnShow" - fired after content is shown
    * New option "padding" - sets nice padding around content
    * Added fix as reported on this post
    * Fixed bug - added missing unbind actions
    * + Some minor CSS and code changes

I think i will be going to develop a new fancaboxmodul, to use all possibilities that are in WB

Dietmar

Quote@erpe: on your page only works youtube-link, but it dont play...

I simply replaced the fancybox js with the new one.

That is not the way updates can be made, Dietmar (from my point of view).

We should talk about this.........

rgds

erpe

If the snippet and modules are developed well, then there are no problems. For me it is not theme to discuss it.

I want the best for WebsiteBaker. There were bugfixes and so i replace it.

I started a new fancybox snippet, think tomorrow it will be finish. I look in the old functionname to set it equal, so that nobody has problems. But now the snippet will work with frontend.css for your own styles and frontend.js. If to set the JS before bodyend, then rename frontend.js to frontend_body.js

If there are problems i will be going to help. I know, for most people there are missunderstandings to work with jquery framework.

Dietmar

But remember:
2.8. is the current version..............

rgds

erpe

Oh yes i know, i only develope under 2.8 and will be tested too under 2.7

Dietmar

But 2.7 has no include/jquery directory.........................

Hi Dietmar, hi Erpe,

on a later version I made some small changes to get valid code using fancybox https://forum.WebsiteBaker.org/index.php/topic,11327.msg68099.html#msg68099 (https://forum.websitebaker.org/index.php/topic,11327.msg68099.html#msg68099). Nobody reacted, except Vyni, so maybe i am totally wrong. I have to say, that I am no real coder.

Now I used Fancybox 0.4 and I also didn't get valid code this time. With these changes it is valid:

1. I put this into the the head of index.php of my template instead of the include.php of fancybox
<link href="<?php echo WB_URL; ?>/modules/fancy_box/screen.css" type="text/css" rel="stylesheet" media="screen" />

2. I changed include.php to
<?php
$debug = false;
if (true == $debug ) {
    ini_set('display_errors', 1);
    error_reporting(E_ALL);
}
if (!function_exists("use_fancy_box") ) {
    function use_fancy_box() {
    ?>
   <script language="JavaScript" type="text/javascript" src="<?php echo WB_URL; ?>/include/jquery/jquery-min.js"></script>
   <script language="JavaScript" type="text/javascript" src="<?php echo WB_URL; ?>/include/jquery/plugins/jquery-fancybox.js"></script>
   <script language="JavaScript" type="text/javascript" src="<?php echo WB_URL; ?>/include/jquery/plugins/jquery-pngFix.js"></script>
   
   
   <script language="JavaScript" type="text/javascript">
   $(document).ready(function() { $("a.fb").fancybox();
   $("a.page_fb").fancybox({ 'hideOnContentClick': false,
                           'zoomSpeedIn':0,
                              'zoomSpeedOut':300 });
   $("a.pic_fb").fancybox({ 'hideOnContentClick': true });
   $("a.pic1_fb").fancybox({ 'hideOnContentClick': true,
                           'overlayShow': true,
                           'frameWidth': 800,
                              'frameHeight': 600 });    
   $("a.video_fb").fancybox({ 'overlayShow': true,
                              'frameWidth': 425,
                              'frameHeight': 355 });
   $("div#use_fb a").fancybox({ 'hideOnContentClick': true,
                           'overlayShow': true,
                           'frameWidth': 700,
                              'frameHeight': 600 });
   });
   </script>
   <?php
    }
}
?>

What's your opinion about that?

Best regards

Uwe

Hi Uwe,

I only have problems with embed code and valide xhtml, if i use object its not shown in each browser.

Dietmar

Hi Dietmar,

could you please explain it a little bit more detailled because I dont understand?
The site I am using the patched version of FB 0.4 is http://www.willingen-ferienhaus.com/ (http://www.willingen-ferienhaus.com/)

Thanks in advance!

Best Regards

Uwe

Yes, i'm a fan for valide code, your side is valide. But if want to open a video, e.g. from youtube with fancybox, then most it is included with object and embed tags. And embed don't exists in xhtml

Dietmar

Ah ok, now I understand. But even then you would probably have less faults with my changes. Don`t you think so?

Best Regards

Uwe

Yes is the better way to put the css in the head. i do it with the jquery insert plugin on the fly, only if needed.

Dietmar

Quote from: Luisehahne on October 17, 2009, 12:08:05 AMYes is the better way to put the css in the head.

Yes. Maybe a frontend.css like in news and form would easier for unexperienced users.

But I also changed the syntax of the calls for the js-files.

Best regards

Uwe

Yes the include folder is ok, i see it. You only must be check, that jquery.js is not loaded twice.

Dietmar

@albatros

if the 0.3c release gives valid code the only reason for this can be the implementing of the css file.
I personally don't like to load css files in the head if they are only needed for special modules.

Please check if the 0.3c release is valid.
If yes I will modify the fancybox 0.40 with this kind of implementing css.

Thanks for your information.

rgds

erpe

Hi

I uploaded new (valid) release 0.41 to AMASP (http://www.websitebakers.com/pages/modules/various/fancy-box.php)

A small tutorial is posted here:
https://forum.WebsiteBaker.org/index.php/topic,11327.msg67934.html#msg67934

Validation can be seen here:
http://www.rvb.bplaced.net/pages/fancy-valid.php

Please keep in mind that you can use this droplet to call fancybox:


ob_start();
   use_fancy_box();
   $fancy_content = ob_get_contents();
ob_end_clean();

return $fancy_content;


and call it with

Quote[[fancybox]]

It will not be available on the official library because it is a function call that needs the snippet fancybox.

rgds

erpe

my solution

fancybox v0.40 installed

header

<link rel="stylesheet" type="text/css" href="<?php echo TEMPLATE_DIR; ?>/css/style.css" media="screen,projection" />
        <link rel="stylesheet" type="text/css" href="<?php echo WB_URL; ?>include/jquery/plugins/jquery-ui.css" media="screen,projection" />
        <script language="JavaScript" type="text/javascript">
         var URL = '<?php echo WB_URL ?>';
        </script>
        <script type="text/javascript" src="<?php echo WB_URL;?>/include/jquery/jquery-min.js"></script>
        <script type="text/javascript" src="<?php echo WB_URL;?>/include/jquery/jquery-ui-min.js"></script>
        <script type="text/javascript" src="<?php echo WB_URL;?>/include/jquery/jquery-insert.js"></script>
        <script type="text/javascript" src="<?php echo WB_URL;?>/include/jquery/plugins/jquery-corner.js"></script>
        <script type="text/javascript" src="<?php echo WB_URL;?>/include/jquery/plugins/jquery-fancybox.js"></script>
        <script type="text/javascript" src="<?php echo WB_URL;?>/include/jquery/plugins/jquery-pngFix.js"></script>
        <?php
    // automatically include optional WB module files (frontend.css, frontend.js)
    if (function_exists('register_frontend_modfiles')) {
        register_frontend_modfiles('css');
        register_frontend_modfiles('js');
    } ?>

sreen.css renamed in frontend css and made a frontend js


   $(document).ready(function() { $("a.fb").fancybox();
   $("a.page_fb").fancybox({ 'hideOnContentClick': false,
                           'zoomSpeedIn':0,
                               'zoomSpeedOut':300 });
   $("a.pic_fb").fancybox({ 'hideOnContentClick': true });
   $("a.pic1_fb").fancybox({ 'hideOnContentClick': true,
                           'overlayShow': true,
                           'frameWidth': 800,
                              'frameHeight': 600 });
   $("a.video_fb").fancybox({ 'overlayShow': true,
                              'frameWidth': 425,
                              'frameHeight': 355 });
   $("div#use_fb a").fancybox({ 'hideOnContentClick': true,
                           'overlayShow': true,
                           'frameWidth': 700,
                              'frameHeight': 600 });
   });



thats valid and works wonderfull

http://template.developer-base.de/pages/start/fancybox-valide.php

It is similar to what I did in the fancybox 0.41.

But you don't need to put code in the head of your template.

rgds


erpe

maybe someone can translate  :-D

da ich jquery ja eh global verwenden will, "war das nicht so gedacht mit 2.8?"  :-D, zb mit corner, ist es so doch einfacher mit einem eintrag in die head. kann jetzt  auf jeder seite jedes thumb mit der class belegen ohne das droplet einfügen zu müssen.

But not everybody wants every script on every page................

rgds

erpe

QuoteBut not everybody wants every script on every page

Whats with fancybox as pagemodul, in meantime i write a german help file, later translate in english

@demo
http://WebsiteBaker.wdsnet.de/wb/pages/de/jquery/fancybox.php (http://websitebaker.wdsnet.de/wb/pages/de/jquery/fancybox.php)

Dietmar

There is some bug / not valid xhtml that seems to show in google chrome


<script type=javascript />

should read:

<script type="javascript" >

or perhaps this is enough:

<script type=javascript>


Cannot confirm this.
Please see validation links on this page:
http://www.rvb.bplaced.net/pages/fancy-valid.php

rgds

erpe

How can I get the arrows to work like in the "Image Gallery" example
http://fancybox.net/example
so that I can move on to the next picture directly without having to close the current one first.


/masarin

hi, your pics have class?
they need rel="fancybox" too.

dbs

Quote from: dbs on December 15, 2009, 09:28:56 AM
hi, your pics have class?
they need rel="fancybox" too.

dbs

When I add the rel="fancybox" to the link fancybox is not engaged and the picture opens without a fancybox window.


<div><a href="lift.jpg" class="pic_fb" rel="fancybox"> pic1 </a>   
<a href="berg.jpg" class="pic_fb" rel="fancybox"> pic2 </a></div>


<a href="image5.jpg" rel="fancybox" class="pic1_fb"><img border="0" src="thumb5.jpg" alt="" /></a>

thats the right way

Quote from: maverik on December 15, 2009, 11:25:53 AM

Code Select Expand

<a href="image5.jpg" rel="fancybox" class="pic1_fb"><img border="0" src="thumb5.jpg" alt="" /></a>

thats the right way

when i add rel="fancybox" to a link FancyBox stops working.


/masarin

<a href="lift700.jpg" rel="fancybox" class="pic1_fb"> <img height="37" width="50" src="lift50.jpg" alt="" /></a> <a href="berg.jpg" rel="fancybox" class="pic1_fb"><img height="37" width="50" src="lift50.jpg" alt="" /></a>

Is there a link to the site?

rgds

erpe

Quote from: erpe on December 15, 2009, 03:41:46 PM
Is there a link to the site?

rgds

erpe

Heres a test page with two pictures.
http://hoppsaweb.se/enovx/pages/se/test.php
I want to be able to open one of them and then click on a link (arrow) in the open picture to get to the second one.
Just like in this page:
http://www.berann.at/cms/kunst/malerei.html

/masarin

QuoteGalleries are created from found anchors who have the same "rel" tags

http://fancybox.net/howto

Hello,

i am trying to put the smooth gallery in the FancyBox, but the hole Fancybox is not working.

The website is http://www.fritz-bicker.de/wb/gallery/broschueren.php (http://www.fritz-bicker.de/wb/gallery/broschueren.php) and click on the first picture to see it.

I already put the <?php use_fancy_box(); ?> in the index.php and i use the blanc css template for the smmoth gallery.

I hope anyone got an idea to get it working.

Thank you in advance.

David

jquery-min.js + jquery-fancybox.js are 2x loaded...

Thank you, but its still the same problem.  :?

da dein template anders aufgebaut ist als wb-templates sein sollten, such mal nach jquery einbinden und lies mal hier:
http://www.websitebakers.de/tutorials/topics/einbindung-der-fancybox.php (http://www.websitebakers.de/tutorials/topics/einbindung-der-fancybox.php)

Vielen Dank für deine Antwort dbs,

ich habe jetzt das standard template "Round" genommen und die Facybox mit <?php use_fancy_box(); ?> in der index.php eingebunden.

Die Faccybox wird so aufgerufen

<a href="[wblink40]" class="video_fb" rel="fancybox" ><img hspace="9" height="61" width="111" vspace="8" alt="" src="http://www.fritz-bicker.de/wb/media/Broschueren/intro/3.png" /></a>

und das wäre die Seite (Smmoth Gallery) die darin gezeigt werden soll. http://www.fritz-bicker.de/wb/gallery/broschueren/alfa.php (http://www.fritz-bicker.de/wb/gallery/broschueren/alfa.php)

Öffnet sich aber leider im neuen Fenster bzw. funktioniert dies nicht.

Ich hoffe Sie können mir helfen.

Schöne Grüße und vielen Dank schon mal.

David

das ist so eine sache, wenn wb seine templates nicht jquery-ready ausliefert.
im head(vor </head>) muss das stehen was du auf dieser seite unter einbindung jquery siehst.
im body brauchst du dann jquery nicht nochmal aufrufen.
http://www.WebsiteBaker.net/pages/topics/die-colorbox-als-modul-snippet.php (http://www.websitebaker.net/pages/topics/die-colorbox-als-modul-snippet.php)

am besten du lässt fancybox weg und nimmst die colorbox aus dem link ;-)
und besser du kommst rüber in den deutschen teil des forums.

sorry for so much german here...

dbs