Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: Gallery is not showing in Full Screen

  1. #1
    Join Date
    Oct 2017
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Gallery is not showing in Full Screen

    Hi All,
    I have an issue with one of my website page where I attached two pages with iframe. In a single page my gallery shows in full screen when I enter full screen.

    But I attached two pages with iframe the "Enter Full Screen" of gallery doesnot work.

    Now this was sorted by jscheuer1 before but recently I have used some updated version of .js which casued me blocking me to enter full screen.

    This is the link where I used iframe to attached two pages..

    http://irelandawamileague.com/new_de..._Done_2017.php


    Heres the code of Java Script currently I have

    Code:
    <script>
        
           
    
        // Load the classic theme
        Galleria.loadTheme('galleria.twelve.min.js');
        
    
        
        // Initialize Galleria
        $('#galleria').galleria({
        
    
        
    	    // Toggles the fullscreen button
    	    _showFullscreen: true,
    	
    	    // Toggles the lightbox button
    	    _showPopout: false,
    	
    	    // Toggles the progress bar when playing a slideshow
    	    _showProgress: true,
    	
    	    // Toggles tooltip
    	    _showTooltip: true,
    	
    	    // Localized strings, modify these if you want tooltips in your language
    	    _locale: {
    	        show_thumbnails: "Show Thumbnails",
    	        hide_thumbnails: "Hide Thumbnails",
    	        play: "Play",
    	        pause: "Pause",
    	        enter_fullscreen: "Enter Fullscreen",
    	        exit_fullscreen: "ExitFullscreen",
    	        popout_image: "Popout image",
    	        showing_image: "Image %s sur %s"
    	        
    	    }
    	});
    if(window.location.href !== top.location.href){
    	(function(){
    		var topdoc = top.window.document, topiframe = topdoc.getElementsByName('iframe1')[0].style;
    		$('body').on('click', '.galleria-fullscreen', function(){
    			var $t = $(this);
    			setTimeout(function(){
    				if($t.parents('.galleria-container').eq(0).hasClass('fullscreen')){
    					topdoc.documentElement.style.overflow = 'hidden';
    					topiframe.height = '100%';
    					topiframe.width = '100%';
    					topiframe.position = 'fixed';
    					topiframe.top = 0;
    					topiframe.left = 0;
    				} else {
    					topdoc.documentElement.style.overflow = '';
    					topiframe.height = '';
    					topiframe.width = '';
    					topiframe.position = '';
    					topiframe.top = '';
    					
    					topiframe.left = '';
    			}}, 300);
    		});
    	})();
    }
    
    </script>
    Please help me on this.

    Thanks
    Last edited by asarker@eircom.ie; 01-15-2018 at 01:04 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,497
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I had taken a quick look at this around the time you first posted it and everything was as you said it was. Right now, however, I don't see the gallery anywhere on the page you linked to. Can't fix something that's not there.

    But the code I gave you should be completely insulated from other javascript, so perhaps that's not the problem. Did you change the name of the iframe, or take away it's name, or name another one on the page the same as it?
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Oct 2017
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi jscheuer1,
    the gallery is there on that linked page.
    Here's the link again. You will find it end of this page.
    http://irelandawamileague.com/new_de..._Done_2017.php

    I havent change anything. It was the same as it is now. but this stopped working with updated version of css and .js
    Last edited by asarker@eircom.ie; 01-22-2018 at 10:35 AM.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,497
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Oh I see it, it was hidden by the cute scrollbar. It's getting a cross domain violation. If there really is no cross domain issue, this often happens when one page is www. whatever and the other doesn't include the www part. Or it can happen when one page is https and the other http. But as far as I can tell, neither of those are the problem. But I might have missed it. Still I think it's something else. Did you update the galleria script or change its initialization? You did say you updated something, what was it that you updated? You may have to revert that. Possibly though, you might be able to get your own copy of it. See, if the updated script is on another domain, that might be what's causing the violation.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Oct 2017
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi jscheuer1,
    See, these were updated to play video on this galleria, specially this one
    http://irelandawamileague.com/new_de...a-1.3.5.min.js

    also Updated vs are
    http://irelandawamileague.com/new_de....twelve.min.js

    and the last one is the css
    http://irelandawamileague.com/new_de...ria.twelve.css

    but what I believe it is the galleria-1.3.5.min.js which is casuing such issue.

    This galleria is good where you can play image and videosClick image for larger version. 

Name:	Capture.JPG 
Views:	37 
Size:	74.5 KB 
ID:	6251

    thses issues I found when I inspect the page in chrome.
    Last edited by asarker@eircom.ie; 01-22-2018 at 05:50 PM.

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,497
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Yes, I saw those too. There's no cross origin issue with the code I gave you. Both pages are on the same domain. I was thinking that perhaps a video in the slideshow has an iframe from another domain. But that would likely mean that it wouldn't go fullscreen even without your iframe. But there are so many layers of code and things happening, the browser may and/or the code (the other code, I don't think mine would cause that*) may be overreacting. Let me check the page by itself. It works fine. What I would suggest is putting it on the page where you want it instead of using an iframe. Then you wouldn't need my code, and whatever the problem is with your iframe should go away.

    *one way to test would be to remove my code and see if the error goes away. I know the slideshow will likely no longer go fullscreen on the top page, but it might. That might be part of the problem. It may be duplicating what you and I worked out.

    Still the best way to fix this is to put the slideshow on the top page. If you tried that before, and there were conflicts, those should be easier to figure out than where this cross domain issue is coming from.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  7. #7
    Join Date
    Oct 2017
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi jscheuer1,
    As you advised I tried to do that removing your codes but that didnt work. but it works on full screen if I put the gallery on the top of the page. Please find below link.

    http://www.irelandawamileague.com/ne...g-Daytest.html

    I am also trying to figure it out why its showing cross browser violation? I have removed those video links and tried with only pictures when I used gallery with Iframe, but that didnt work. This is kinda strange..

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,497
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    It's not called a cross browser violation, it's a cross domain violation. This can happen sometimes when it's not warranted. It's meant to prevent javascript code from one domain from affecting a page on another domain, it's also meant to prevent AJAX from acquiring content from one domain and displaying it on another. This second thing can be overridden with the appropriate header (basically either giving the other domain, or all domains, depending upon the header, permission to fetch the content), but I don't think that's the issue here, at least not from the error we are seeing. As I already mentioned sometimes we see this error even on the same domain when one page uses www in its address and the other does not, or when one page uses https and the other does not. But again, I don't see that happening here.

    I think that this is something different, something I haven't seen before. I think that somehow the updated code was mistaking your top page for the page with the gallery on it and then tried to communicate down the chain of iframes from there. Vimeo uses iframes, at least sometimes, so once the updated code started looking for them it also tried to 'talk' to that one, which definitely is on a different domain. If I'm right, or if it's anything like that, then the choices are:

    1.) Put up with it and don't allow the gallery to go fullscreen
    2.) Debug or have someone debug the updated code
    3.) Revert to the previous code
    4.) Put the gallery on the top page.

    #2 really should be done by the folks writing the code or someone with more time and patience than I have for wading through what appears to be a very complicated glitch. You can easily choose any of the others, but I think #4 is best. We know it works, now we just have to figure out how to do it without messing up your layout or creating any conflicts on that top page.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #9
    Join Date
    Oct 2017
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi Jscheuer1,
    Thanks very much for all the effots that you have made. You are right, this is a cross domain violation and looks like it wont be possible to sorted this time. I had sopken to few my collegues and agreed to keep the gallery as it is now despite of not going in full screen. To put the gallery on top page will be another hassle and it wont looks good. So I have decided on your option-1. I will still search for solution though.Thanks again.

  10. #10
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,497
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Two things you might try, and I have no idea if they will help or not would be:

    Get rid of the canonical link from the page in the iframe (near the beginning):

    Code:
           <link rel="canonical" href="https://vimeo.com/25750735">
    This shouldn't be needed, and might somehow be the cause or contributing to it.

    The other thing would be to host your own copy of jQuery and use it instead of (also near the beginning of the page in the iframe):

    Code:
            <!-- load jQuery -->
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
    to do that, download that version of jQuery, put it in the same folder as the iframe, and change the above to:

    Code:
            <!-- load jQuery -->
            <script src="jquery.js"></script>
    Use whatever name you saved your copy of jQuery as.

    The cache will have to be emptied and the page in the iframe should be refreshed to see changes.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Similar Threads

  1. full-screen option
    By auntnini in forum JavaScript
    Replies: 3
    Last Post: 05-15-2014, 02:22 AM
  2. full screen image gallery help needed
    By shas1280 in forum Flash
    Replies: 0
    Last Post: 04-06-2011, 11:39 AM
  3. Full-Screen Pop-Up.
    By Moglizorz in forum HTML
    Replies: 5
    Last Post: 04-22-2007, 01:52 AM
  4. Onresize and full screen
    By hsantos in forum Looking for such a script or service
    Replies: 1
    Last Post: 02-25-2007, 03:07 AM
  5. go to full screen on load
    By jpozzi in forum JavaScript
    Replies: 1
    Last Post: 03-24-2005, 11:44 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •