jQuery FancyBox plugin

The FancyBox is one of the plugin that I like the most. It's so easy to use and renders really nicely, especially with images. It's a Mac like zooming tool that you can customize quite well and really looks amazing. Source and © Janis Skarnelis

Thank You for Downloading

I'm glad that you found my work useful. If you did, it might help some other people too. So why not helping me spread the word with a tweet? You could also buy me a coffee to thank me for my code and explanations if you prefer ;).
I hope you'll enjoy your download. Regards. Jeremy.

How to setup

As usual, the first thing to do when you want to use a plugin is to include the required files in the header of your page.

For the FancyBox, those files are first the jQuery library, then the plugin script, and an additional stylesheet:

  1. /** jQuery Inclusion **/
  2. <script type="text/javascript" src="Path_to/jQuery.js"></script>
  3. /** Plugin Inclusion **/
  4. <script type="text/javascript" src="Path_to/jquery-fancybox.js"></script>
  5. /** Additional Style **/
  6. <link href="Path_to/fancybox.css" rel="stylesheet" type="text/css" />

Very similar to the LightBox, the next step is to declare how and when the FancyBox will be displayed on your page.
So in the same fashion, the following code tells that every link that has a class fancybox will have its content opened in a fancybox.
It can be added in the page header or in a separate js file.

  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. $(".fancybox").fancybox();
  4. });
  5. </script>

Finally, you just need to create a link whose class will have to be fancybox and whose href attribute will need to contain the path of the element you wish to open within the fancybox:

  1. <a href="Path_to_target" class="fancybox">Test FancyBox Plugin</a>

65 Responses to jQuery FancyBox plugin

  1. download link not working

  2. Thank you for noticing, there was a problem with the rewriting that locates the archive. I hope you'll be able to download it and set it up now.

  3. when I download it and do accordingly, the page is not opening in a fancy box, it opens as a normal link!!! I am using same as instructed. what else can be done?

    Thank you

  4. @Zulian. The first thing to check is to make sure that the files are included properly. (You can use firebug to see that for example).

    Then, can I ask you which version of jQuery are you using? And do you have the problem in several browser or just one ? Have you put the code in your header or a separate linked js file?

    Thank you.

  5. Thank you yes... it seems all files are ok. see below
    <script type="text/javascript" src="fancybox/jQuery.js"></script>
    <script type="text/javascript" src="fancybox/jquery-fancybox.js"></script>
    <link href="fancybox/fancybox.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript">
    and to run I used

    <a href="memberprofile.php" class="fancy">Test FancyBox Plugin</a>

    I am using the one downloaded from this site only.

  6. Ha Ok I see what is wrong.

    The class you are using in the javascript setup and in the links must be the same!
    That's why in your example, according to what is written in your header, your links should have the class "fancybox" and not "fancy" to work.

    Does that solve the issue?

  7. when I changed it, it's still opening as a normal link, not into the fancy box. below is my changed code.

    <a href="memberprofile.php?member=44" class="fancybox">Test FancyBox Plugin</a>

  8. Hi Zulian.
    I've downloaded my own files from the site, and put them in a folder.
    In this folder, I've created a file test.html, with the following content:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="jquery-1.2.3.pack.js"></script> //The jQuery from the download
    <script type="text/javascript" src="jquery.fancybox-1.0.0.js"></script> //The fancybox script from the download
    <link rel="stylesheet" type="text/css" href="fancy.css" />
    <script type="text/javascript"> //Javascript Setup
    <a href="fancy_closebox.png" class="fancybox">Test FancyBox Plugin</a> //Link that opens in a fancybox

    It's working absolutely nicely.
    Is this page working for you if you place it in the fancybox folder an run it?

    Can you send me the page you are working with? Or a link to your work? So I might be able to see what's going wrong.

  9. I need to resize fancy box and also to give a light black shade to page background. how do I do it?

  10. I'm glad it's now working.
    To add an overlay and to control the size of the box, you can use the following options in the javascript setup:

    <script type="text/javascript">
    frameWidth: 600,
    frameHeight: 400,
    overlayShow: true,
    overlayOpacity: 0.5

    This will show an overlay of opacity 0,5, and a box of 600*400. Enjoy !

  11. Thank you so much.
    It worked... and I love your work

  12. Hi, I instelled fancy box and work good, but in IE8 not working, this is cod.
    <link rel="stylesheet" type="text/css" href="../jquery.fancybox/jquery.fancybox.css" media="screen" />
    <script type="text/javascript" src="../jquery.fancybox/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="../jquery.fancybox/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="../jquery.fancybox/jquery.fancybox-1.2.1.pack.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
    'zoomSpeedIn': 400,
    'zoomSpeedOut': 400,
    'overlayShow': false

    <a title="title" id="single_image" class="yesopen" href="albunes/imagen ><img src="albunes/sml_imagen">

  13. Have you tried with another version of jQuery? Version 1.2.3 for example? It's the one I'm using with this example and it works well with IE8.

  14. Thank you so much.
    It worked. you had razon

  15. Thank you so much, i lost last 2 hour for that.

  16. Hi jeremy, thank you for sharing this ressource.
    Ive DL the latest version of this script, but there seems to be some issues with the display of remote content, basicaly it will load for some time, then redirect to the new URL.
    It this the reason why you stick to version 1.00 of facny box ?

  17. Hi Sam.
    You're welcome.
    2 things. First I've found that associating the version 1.00 of fancybox, and the version 1.2.3 of jQuery gives the most compatible results, especially with IE8. That's why I like that version.
    Then, as you can see, in the demonstration links it is working.
    Is your problem occuring with any single remote content? Because sometimes this is caused by the loaded website itself.

  18. Is there any way to make a gallery of this. I tried with a rel=group, but it had some strange syntax javascript bug and opened the image in a new page rather than a grouped fancybox.

  19. @Stephen.
    Hi Stephen.
    Yes there is a way. As you can see I've udated the demonstration of this post to add a gallery example.
    This is how I'e done it. First, create you html markup:

    <div id="gallery">
     <li><a rel="group" href="/Path_to/image1.jpg">
      <img src="/Path_to/thumb1.jpg" /></a></li>
     <li><a rel="group" href="/Path_to/image2.jpg">
      <img src="/Path_to/thumb2.jpg" /></a></li>
     <li><a rel="group" href="/Path_to/image3.jpg">
      <img src="/Path_to/thumb3.jpg" /></a></li>
     <li><a rel="group" href="/Path_to/image4.jpg">
      <img src="/Path_to/thumb4.jpg" /></a></li>
     <li><a rel="group" href="/Path_to/image5.jpg">
      <img src="/Path_to/thumb5.jpg" /></a></li>

    Please note that the rel group as been added to each link.

    Then, in your javascript, setup the gallery like this:

    jQuery("#gallery a").fancybox();

    That should do. Let me know. Good luck.

  20. @jdmweb.
    Is there a way to have a single image on the page that when clicked will open a gallery in Fancybox? I do not want to display all the photos on the page for each category but would love to have the galleries work this way.

  21. @pazul.
    Yes there is a way. As you can see, I modified the demonstration to show you. It is quite easy really, and is also quite similar to a normal gallery setup. You'll just have to hide the other elements with a display: none. As a result, they won't be visible on the page, but the gallery will work.
    This is how I've done it:

    ->Create the gallery. The first li is visible, the others are hidden.

    <div id="gallery2">
     <li><a rel="group" href="/Path_to/image1.jpg">
      <img src="/Path_to/thumb1.jpg" /></a></li>
     <li class="hidden"><a rel="group" href="/Path_to/image2.jpg">
      <img src="/Path_to/thumb2.jpg" /></a></li>
     <li class="hidden"><a rel="group" href="/Path_to/image3.jpg">
      <img src="/Path_to/thumb3.jpg" /></a></li>
     <li class="hidden"><a rel="group" href="/Path_to/image4.jpg">
      <img src="/Path_to/thumb4.jpg" /></a></li>
     <li class="hidden"><a rel="group" href="/Path_to/image5.jpg">
      <img src="/Path_to/thumb5.jpg" /></a></li>

    ->Add the style hidden in the stylesheet:

    #gallery2 li.hidden{

    ->Add the jQuery setup:

    jQuery("#gallery2 a").fancybox();

    And it should work. Let me know.

  22. thankyou thankyou thankyou :)

  23. @maria.
    You're welcome! ;-)

  24. Hi, I was wondering if you'd ever tried creating a gallery (via the rel tag) where the links within the gallery call different fancybox functions (use different classes). For some reason, they don't all get grouped together; some get left out of the gallery.

    Example: I have several thumbs on a gallery page which all use one simple FB class/function, and a few more thumbs that require an iframe implementation. The iframe ones *do not* get included in the gallery cycle even though they share the rel='group' tag. (The iframe implementation works perfectly, by the way, if you click that thumb directly -- but it doesn't display any back/next links in it and claims to be "1 of 1". The images, on the other hand show "1 of 3" rather than "1 of 4" and the back/next cycle skips the iframe one entirely.)

    [ js: ]
    'hideOnContentClick': false,
    'overlayOpacity': .7,
    'overlayColor': '#000',
    'centerOnScroll': false

    var fWidth = parseInt($(this).attr('href').match(/width=[0-9]+/i)
    var fHeight = parseInt($(this).attr('href').match(/height=[0-9]+/i)
    'hideOnContentClick': false,
    'overlayOpacity': .7,
    'overlayColor': '#000',
    'centerOnScroll': false


    [ html: ]

    <a class="pic" href="images/demo_pic.jpg" rel="group" title="Image 1 caption"><img src="images/temp_img_thumb1.jpg" /></a>

    <a class="pic" href="images/demo_pic2.jpg" rel="group" title="Image 2 caption"><img src="images/temp_img_thumb2.jpg" /></a>

    <a class="fancybox" rel="group" href="flash_video_embed.html?width=529&height=400" title="video"><img src="images/temp_img_thumbvideo.jpg" /></a>

    <a class="pic" href="images/demo_pic3.jpg" rel="group" title="Image 3 caption"><img src="images/temp_img_thumb3.jpg" /></a>

    Don't worry about the crazy parsing in the JS for the iframe -- it just allows a custom height and width to be passed to the function. Again, this works fine on its own -- the issue is that the rel='group' trick isn't looping the iframe one into the mix. Any ideas...?

  25. Thanks for this, I had originally used the Fancybox from Fancybox.net, although when viewing images in Internet Explorer 8 the pop-up would appear completely white with no image, this problem could be remedied by using the compatibility view, although I wasn't satisifed.

    Then I came across this and it works like a charm! Looks great too.

  26. @Koik.
    The reson why they don't all get grouped together is because in your jQuery code, you are using the class of the thumb to set up a group ( $("a.pic") and $('a.fancybox') ), and those classes are different, resulting in the creation of 2 different galleries.

    Also, the fact that you are using the function $('a.fancybox').each(), means that you are creating 1 gallery per link whose class is fancybox, that's why when you open it, you have img 1 of 1 instead of 1 of 3.

    Maybe you could try something a bit different. You affect an event function on all the links. When a link is clicked, you check its class, if the class is .pic then you do a fancybox, and if it is .fancybox then you do an iframe. In that way, they will all be based on the same base, but they still will be able to differenciate between your 2 classes. The only thing that you might loose is your counter.

    It would look like something like:
    $(this).fancybox(); //Normal fancybox
    } else {
    $(this).fancybox(); // Iframe

  27. @jdmweb.
    Thanks for the feedback -- much appreciated. I'll give your suggestion a shot some time this week.

  28. Hello I got a problem with fancybox.. cant find any solution in google for this can you help me what I am doing wrong ?
    On webpage I gave in website window I have 1 picture there and want to get it working with fancybox... on localhost I have no problem at all.. but since I gave this to webhosting I have problem that zommed picture is not loading and freezes in loading screen of picture... I checked paths everything and it should be ok. Can you help pls ?

  29. @r1dd1ck.
    Hello. I went onto your website, and I discovered that there's a 404 not found error on your picture. It means that the script is not finding it.

    I think it might be because the path to the picture is case sensitive in your hostging whereas it is not on your localhost. Make sure the script can access the picture and then it should work.

    Good luck.

  30. @jdmweb. Man sry I am stupid was completelly overlooking capital letter in that big picture... on windows it was workign but on webhosting not cause its on linux... Thx a lot for helping man.

  31. Hi Jeremy,
    I am very new to jQuery but have followed your tutorial and gotten my gallery of images to work. However, I can't seem to change the size of the thumbnails to be other than what your thumbnails are on this tutorial. I've resized my thumbs to 150x150 but they still show up at 72x72. How do I go about fixing that? I developing locally so I don't have a site to show you.
    Thanks for your help!

  32. @Barb.
    You have an interesting problem.

    At least I am glad that your gallery is working because that's the trickiest part.

    Just to clarify, are your images tags written like this?: <img src="/lib/lightbox/photos/thumb_image2.jpg" width="72" height="72" alt="" />.

    Please note the absence of 'px' after the size of the image.

    You can email me a little portion of your code if you want me to have a look at it at jeremy@jdmweb.com, to see if I can spot what is wrong.
    Otherwise have a look at the source of this page and compare it to your code. I don't think this is a major issue really, we should be able to solve it quite easily.

  33. I figured out the problem. Silly mistake on my part and the thumbs are resized nicely. Thanks anyway!

  34. @Barb.
    Ok good then.
    Well done.
    Well if you need some help later on you know where to come now :-)
    Good luck.

  35. hai sir, i am Latcha Prabu. Actually i like to play a youtube video in facebox. i have 100 youtube video thumbnails. I give it to my user 10 videos and click show more the i give another 10 vides... When user click the show more i list the next 10 videos using xmlhttp request. When i list through xmlhttp request it not work... please help me sir.....

  36. Hi sir.
    Yes I know why it does that. As the thumbnails you are loading via Ajax are not present when you first load the page, they are not registered with the event that triggers the fancybox. Once you call your xmlhttp request, at the end of it, you need to register the freshly loaded thumbnails with the fancybox again. So for example, if you have used something like $('a.fancybox').fancybox() at the beginning, call this again at the end of your xmlhttp request function and it will work.
    Good Luck.

  37. Thanks a lot. i am very happy..... two days i worked on this. now only i get the solutions. thanks very much.

  38. Hi Jeremy,
    I am new to Jquery and have an issue with using multiple galleries on 1 page.
    Each gallery has it's own unique div id which is called in javascript, however the first gallery manages to show all of the images in all of the subsequent galleries on the page.

    Any ideas where I am going wrong?

  39. @Seether.

    Do you specifically mention the id of your div in the javascript call when you register the fancybox?
    In other words do you write something like $('#div1 a.fancybox').fancybox() and then $('#div2 a.fancybox').fancybox() and so on?

    Or are you only using something like $('a.fancybox').fancybox() ?

    That's the only thing I can think of from your short message. You can send me a link to your work if you want me to have a look.

    Regards. Jeremy

  40. Thank you very much! It works and looks great

  41. hello, i had a quick question.

    Is it possible for fancy box to open up a link like "yoursite.index.php?act=viewProd&productId=36" in an iframe window?

    When i try, i just get the loading picture.

    Also, can I set the iframe to be a percentage of the browser instead of absolute size?


  42. @jin410.
    Yes it is possible to add a query string in the fancybox link. As long as it leads to a valid page. Check the link you'd like to open without the fancybox and make sure it works first. Look at the demonstration, I changed the first link to open a google search within the fancybox and it works.

    Concerning the size as a percentage, it seems that the frameWidth and frameHeight options only accept a pixel value. But you can calculate a pixel value from the browser size and pass it to the fancybox after. This is how you can do that. The width of the browser is obtained like this: var browserwidth = jQuery(document).width();. Then you set your percentage, for example 50: var percentage = 50;. And then you calculate what it gives you in pixels: var fbwidth = Math.ceil((browserwidth*percentage)/100);.
    You do the same for the height, and you pass those values to the fancybox options:
    frameWidth: fbwidth,
    frameHeight: fbheight
    And it works like a charm.

  43. hello, I have a fancybox code which works great for three images. I am trying to substitute the Pic 2, with a youtube video, and still keep the order functionality. So for example, it will be Pic 1, I click the next arrow, and get a youtube video to play automatically, and the press the next button, and get Pic 3. Can you help me achieve this please sir?:

    <div class="contentArea">
    <div class="full-page">
    <div class="full-page">
    <a href="images/pic1.jpg" class="zoom img" title="Pic 1" rel="portfolio" style="margin-right: 17px;">
    <img src="images/pic1-thumb.jpg" width="150" height="100" alt="Pic 1" />
    <a href="images/pic2.jpg" class="zoom img" title="Pic 2" rel="portfolio" style="margin-right: 17px;">
    <img src="images/pic2-thumb.jpg" width="150" height="100" alt="Pic 2" />
    <a href="images/pic3.jpg" class="zoom img" title="Pic 3" rel="portfolio" style="margin-right: 17px;">
    <img src="images/pic3-thumb.jpg" width="150" height="100" alt="Pic 3" />

  44. @somar911.
    Hi somar, I've updated the page to show an example of mixed gallery. Have a look at the demonstration.

    The way to do it is as follows.
    You create a ul, with each li being a step of your gallery.

    When you want to show an image, you place the image path in the href attribute of the link like you did.

    When it's a youtube video, create a div with an id (for ex id="myvideo1"), outside the ul and paste the youtube embed code in it. Hide this div for a better effect.

    Then, in your list, create a link that points to the anchor of the div, (for ex a href="#myvideo1").

    As a result, when you browse your gallery, it either shows an image, or it plays a video as you flicker through the different items.

    Good luck. Jeremy

  45. Thank you Jeremy! You are very quick to respond with the correct code and extremely helpful! You even included a great example! Thanks for everything!

  46. hi there, I've been implementing fancybox into my schools new website, which for the most part works brilliantly.

    One thing I wanted to do, that I cannot seem to get to work, or find any coding examples of, is how to open up a google search result inside an iframe, instead of opening them up in a separate window.

    Any ideas?



  47. ok I managed to find the answer using jquery.forms

  48. Hi Jeremy,

    I was wondering how to have two different fancybox css, for two different galleries on the same page. Each gallery would use its own css. They are not distinguishable at this point. I also looked around but did not find anything prior to posting. Is this possible?


  49. Hi Jeremy,

    I'm trying to set FancyBox up for a new project I'm working on. I've gotten it working, but there is a link to another page (Google Driving Directions) in the box. When a user clicks that link, it pulls up the Google page inside the box, but it's still very small and the user is forced to scroll both horizontally and vertically in order to see most of the page. Is there a way to resize FancyBox for a web page instead of an image?


  50. @Alex Smith.

    Hi Alex. Do you actually wish to open this new page still in the fancybox? Or would you rather open the link in the parent page? If you prefer to open it in the parent page, use the target="_top" with your link.

    Resizing the frame when the user clicks the link seems more complex...

    There could be a solution but it will also affect the size of your first fancybox. You could for example, change the default height and width to something bigger. Or maybe proportional to the screen size.


  51. Hi I have a template website with fancybox that when you click the image it expands to the bigger view. I would like to change that and just have one thumb nail and it expands with the ability to arrow left or right to the next photo.
    Is there a easy way to accomplish this?


  52. i saw there is page not found handling in fancybox.net front page but there is no sample code and explanation. Not sure i can get some help here. Thanks

  53. Thanks for the help on @pazuls guestion. Thats whas the answer what i where looking for. Thank you and merry Christmas.

  54. Hi Jeremy
    I have videos with different sizes, that are already embedded in html pages (produced by Camtasia). i am using the "open an html page" type link.
    I would like to be able to determine the size of the fancybox using the css. Is that possible?
    You mentioned the default size of the fancybox in an earlier post. I measured the fancybox, found 600x400, and found two occurrences of those figures in the .js files.
    Here is what the code looks like:

    ... |cos|userAgent|400|navigator|600|slow|Function| ...

    When I changed those, the size of the window did change. Is that what you meant? Or is there a better way of doing it?

  55. Hi, running Explorer 9.0 and that are NOT working for me !

    Any uppgrade suggestion ?

  56. This is in the header:
    <!--Fancy Box Shadow Box-->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script&gt;
    <script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.easing-1.4.pack.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
    <link rel="stylesheet" href="/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />

    <script type="text/javascript">
    $(document).ready(function() {
    <!--End of Fancy Box-->

    This is in the body:
    <p>A copy of the conceptual design of the memorial is attached as <a id="single_image" href="images/memorial-concept.png">memorial-concept.pdf</a>.</p>

    I can't get this to work. Any help would be great.

  57. This is in the header:
    <!--Fancy Box Shadow Box-->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script&gt;
    <script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.easing-1.4.pack.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
    <link rel="stylesheet" href="/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />

    <script type="text/javascript">
    $(document).ready(function() {
    <!--End of Fancy Box-->

    This is in the body:
    <p>A copy of the conceptual design of the memorial is attached as <a id="single_image" href="images/memorial-concept.png">memorial-concept.pdf</a>.</p>

    I can't get this to work. Any help would be great.

  58. Now, the Download works again. @Pseudo.

  59. i just installed fancybox 1.3.4 and its working in firefox but not IE 9. any suggestions??

  60. Hello my friend. my fancybox didnt work.why???
    my code is:

    Untitled Document



  61. I'm not a developer, so i work with Fireworks to create my layout. When i move it to dreamweaver the fancybox don't work. Could you help me? This is my webpage adress: http://www.editoracaoeletronica.com

    The code are very big, so i'll not put it here ok?

  62. Forget to tell.. i'm using index2.html to tests (www.editoracaoeletronica.com/index2.html)

  63. Problem! .. It works great but the fancybox only close when I hit the (X) button on the top right. I need it to be closed when I press anywhere else in the screen, just as the demo here. Any suggestions?

    Thank you in advance.

  64. Hello Jeremy, thank you for this great website! I love it!
    I'm having some troubles working on fancybox. It's my first experience with jquery and I'm probably not doing something right. When I click on a picture it opens as a normal link page. Will appreciate if you can give advice here.
    Here's my code:

    $(document).ready(function() {

  65. i just want to say, its very helpful for me,
    might visit : https://nicesnippets.com

Leave a Reply

Your email address will not be published. Required fields are marked *

Other Useful Resources

Getting started with React.js illustration

As a lead developer, I watch the web development market for solid trends (not the hype ones), and see if they could be a tangible addition to our workflow. Like Angular a few years ago, React has gained enough momentum to catch my attention. I decided to try it out in a side project to get a better understanding of how it works. Here are a few things I've noted from our first encounter. This is a beginner's point of view, not a React expert's one, so if you see any mistakes, don't hesitate to let me know, I'll update the article accordingly.

Read more
Standardizing development environments with Vagrant illustration

This is the first article of a series in which we'll explain our development process industrialisation. We'll describe how we went from a team of individuals doing things together but artisanally, to a more industrial and qualitative approach. This first topic talks about how we standardized our development environments with Vagrant.

Read more
How to create an Ajax, validated form illustration

Even on some very famous websites and blogs based on the WordPress platform, such as Smashing Magazine or Webdesigner Depot for example, the comment forms are not checked prior to submission. Which means that if the user hits the submit button without actually filling any information, he is redirected to the famous error: "Error: please fill the required fields (name, email).".

Thanks to jQuery and its plugins, it is possible to change the way those forms are handled, in order to obtain slick effects, and an overall better user experience.

In this tutorial, we'll associate the validation plugin, and the form plugin, to get a contact form that is validated before submission, and submitted via ajax. Why don't you give it a try?

Read more
@Cabaroc Pour ceux que le sujet intéresse, cette marque et cette page sont cités en exemple dans cet article intére… https://t.co/9XxN7wQSUr28 May / 11:05