My favorites | Sign in
Project Home Downloads Issues
READ-ONLY: This project has been archived. For more information see this post.
Search
for
  Advanced search   Search tips   Subscriptions
Issue 333: Two Questions
2 people starred this issue and may be notified of changes. Back to list
Status:  Fixed
Owner:  ----
Closed:  Nov 2009


 
Reported by bomb...@gmail.com, Sep 23, 2009
1) Is it possible to open up a really large image inside the modal - but
not resize the image to fit the viewport?  For example, if I open up a
really large image... I want the modal to take up the maximum viewport
(like it does by default) but then allow scrolling (both horizontal and
vertical) if/when necessary.

2) Is it possible to target a specific DIV by id through an Ajax call?  For
example, I'm loading a page with different categories on it (each category
has an id).  I'm trying to call the the page with the typical #value
appended on the end of the URI.  This does not seem to work with the
default settings.  If I change this to a regular popup, it works as
desired... but I'd like to use the Nyro if possible.

Thanks for any help you might be able to provide and I apologize if this is
not the right place to ask questions.
Sep 23, 2009
Project Member #1 nyro...@gmail.com
1) it's not a feature currently given by nyroModal. Instead, you could simply load
your image using html content and simply add an img tag in this content. By doing
that, you'll see the regular scrollbar as desired.

2) This should work. For instance, if you load page.php#myId, only the content of
#myId might be loaded in the modal. If it's not working, please provide more
information, like your code or something like that.
Sep 24, 2009
#2 bomb...@gmail.com
Thanks... I'll try the image technique that you describe.

As for the second issue... maybe I wasn't clear enough.  I have a page with a bunch
of content on it.  Each content block has a specific ID.  I am trying to load the
page with the target at the top based on the hash passed in the URL.  I do not want
to limit the results to one specific ID (which is what I suspect is happening).  

If I add "target=_blank" to the originating link, everything works as desired but
there is a crazy flash that's generated due to the blank window.  Some of my hashes
contain spaces (e.g., #Digital Media, #Bluray Players, etc.).  Without the addition
of "target=_blank", the window pops up with the default "not found" messaging. 
Adding "target=_blank" resolves this but produces a weird affect.

So... I'm trying to load an entire page with the target at the top - but load the
entire page so the user can scroll through all the results (not just limit it to the
ID).  Basically, I'm trying to use anchors and targets as they would work in simple html.

Does that make any sense?
Oct 3, 2009
Project Member #3 nyro...@gmail.com
Ok I see what you mean for 2, and it's actually a feature request that I never take
time to investigate.
For now, you could do it by yourself using the scrollTo plugin.

To do so:
1) Set the processHandler callback to store the settings.selector in your own var and
set it to null
2) Set the endShowContent callback to make your scrollTo call using you're var

Then i'll add it in the official wiki.

Oct 13, 2009
Project Member #4 nyro...@gmail.com
Did you finally manage to do what you wanted to?
Oct 13, 2009
#5 bomb...@gmail.com
No.  I'm still not able to load the modal at full size and load the image (contents
of modal) at full size - having scrollbars in the modal.  Can you send me an example
of the setting to pull this off?  I might have some parameter incorrectly set.

As for #2... I have not tried it yet because I'm not quite sure how to pull it off. 
I need to spend some time and wrap my head around the approach.

Thanks for checking back with me.
Nov 8, 2009
Project Member #6 nyro...@gmail.com
To make your image loaded in full size, we can use the processHandler callback to
change the content and the type. In the mean time, the size will be set to be far
more than the view port.

$(function() {
	$.nyroModalSettings({
		processHandler: function(settings) {
			if (settings.type == 'image') {
				settings.from = null;
				settings.content = '<img src="'+settings.url+'" alt="'+settings.title+'" />';
			}
		}
	});
});

You can also change the padding setting (default 25) to minimize the gap between the
modal and the layout border.

Then, you're image links has to be sent to a dynamic HTML page. for instance, we can
use: 
The 
Status: Fixed

Powered by Google Project Hosting