Magnific-Popup - Open link from array corresponding to respective photo div
up vote
0
down vote
favorite
EDIT: I've solved my question by rigging some code together. Answers still welcome, but I've solved this for the time being. See the last section for the code.
------------------------------------------------------------------------------------------------------------------------------------
I'm attempting to open a given div that corresponds to an index within an array of web links.
The concept is simple: the divs contain a photo, and when the photo div is selected, magnific popup will do its thing and then open the corresponding link from the index.
Unfortunately, I am only able to get divIndex[0] and webLinkIndex[0] to open on any given div click selection.
If I'm not being clear enough, I apologize; if there are questions, please ask me to clarify.
I used developer tools to narrow down where the click is occurring and attempted to make my own function to handle this.
Feel free to make any modifications.
Code snippets below:
//CLICK FUNCTION
_openClick: function(e, el, options) e.metaKey ) )
return;
var disableOn = options.disableOn !== undefined ? options.disableOn : $.magnificPopup.defaults.disableOn;
if(disableOn)
if($.isFunction(disableOn))
if( !disableOn.call(mfp) )
return true;
else // else it's number
if( _window.width() < disableOn )
return true;
if(e.type)
e.preventDefault();
// This will prevent popup from closing if element is inside and popup is already opened
if(mfp.isOpen)
e.stopPropagation();
options.el = $(e.mfpEl);
if(options.delegate)
options.items = el.find(options.delegate);
mfp.open(options);
this.smugSmugLinkClick(el);
,
///OPEN SMUGMUG LINKS FROM DIV CLICK
smugSmugLinkClick: function(el)
**///FEEL FREE TO POST CODE IN HERE TO MAKE THIS WORK**
,
And here is the array of web links
///SmugMug Links to iterate over for Gallery Page
var smugMugLinks = [
"https://xxx.smugmug.com/Gallery/photo1",
"https://xxx.smugmug.com/Gallery/photo2",
"https://xxx.smugmug.com/Gallery/photo3",
"https://xxx.smugmug.com/Gallery/photo4",
];
------------------------------------------------------------------------------------------------------------------------------------EDIT: Answers still accepted, but some spaghetti code did the trick for this one isolated incident:
///DIV INDEX --> SMUGMUGLINK INDEX
if (window.location.pathname === "/gallery/")
const childs = $(e.currentTarget).parent().parent().parent().children()
const href = $(e.currentTarget).attr("href")
childs.each((i, element) =>
const divHref = $($(element).find("div")[0]).find("a")[0].href
if (divHref === href)
window.open(smugMugLinks[i])
)
javascript jquery wordpress magnific-popup
add a comment |
up vote
0
down vote
favorite
EDIT: I've solved my question by rigging some code together. Answers still welcome, but I've solved this for the time being. See the last section for the code.
------------------------------------------------------------------------------------------------------------------------------------
I'm attempting to open a given div that corresponds to an index within an array of web links.
The concept is simple: the divs contain a photo, and when the photo div is selected, magnific popup will do its thing and then open the corresponding link from the index.
Unfortunately, I am only able to get divIndex[0] and webLinkIndex[0] to open on any given div click selection.
If I'm not being clear enough, I apologize; if there are questions, please ask me to clarify.
I used developer tools to narrow down where the click is occurring and attempted to make my own function to handle this.
Feel free to make any modifications.
Code snippets below:
//CLICK FUNCTION
_openClick: function(e, el, options) e.metaKey ) )
return;
var disableOn = options.disableOn !== undefined ? options.disableOn : $.magnificPopup.defaults.disableOn;
if(disableOn)
if($.isFunction(disableOn))
if( !disableOn.call(mfp) )
return true;
else // else it's number
if( _window.width() < disableOn )
return true;
if(e.type)
e.preventDefault();
// This will prevent popup from closing if element is inside and popup is already opened
if(mfp.isOpen)
e.stopPropagation();
options.el = $(e.mfpEl);
if(options.delegate)
options.items = el.find(options.delegate);
mfp.open(options);
this.smugSmugLinkClick(el);
,
///OPEN SMUGMUG LINKS FROM DIV CLICK
smugSmugLinkClick: function(el)
**///FEEL FREE TO POST CODE IN HERE TO MAKE THIS WORK**
,
And here is the array of web links
///SmugMug Links to iterate over for Gallery Page
var smugMugLinks = [
"https://xxx.smugmug.com/Gallery/photo1",
"https://xxx.smugmug.com/Gallery/photo2",
"https://xxx.smugmug.com/Gallery/photo3",
"https://xxx.smugmug.com/Gallery/photo4",
];
------------------------------------------------------------------------------------------------------------------------------------EDIT: Answers still accepted, but some spaghetti code did the trick for this one isolated incident:
///DIV INDEX --> SMUGMUGLINK INDEX
if (window.location.pathname === "/gallery/")
const childs = $(e.currentTarget).parent().parent().parent().children()
const href = $(e.currentTarget).attr("href")
childs.each((i, element) =>
const divHref = $($(element).find("div")[0]).find("a")[0].href
if (divHref === href)
window.open(smugMugLinks[i])
)
javascript jquery wordpress magnific-popup
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
EDIT: I've solved my question by rigging some code together. Answers still welcome, but I've solved this for the time being. See the last section for the code.
------------------------------------------------------------------------------------------------------------------------------------
I'm attempting to open a given div that corresponds to an index within an array of web links.
The concept is simple: the divs contain a photo, and when the photo div is selected, magnific popup will do its thing and then open the corresponding link from the index.
Unfortunately, I am only able to get divIndex[0] and webLinkIndex[0] to open on any given div click selection.
If I'm not being clear enough, I apologize; if there are questions, please ask me to clarify.
I used developer tools to narrow down where the click is occurring and attempted to make my own function to handle this.
Feel free to make any modifications.
Code snippets below:
//CLICK FUNCTION
_openClick: function(e, el, options) e.metaKey ) )
return;
var disableOn = options.disableOn !== undefined ? options.disableOn : $.magnificPopup.defaults.disableOn;
if(disableOn)
if($.isFunction(disableOn))
if( !disableOn.call(mfp) )
return true;
else // else it's number
if( _window.width() < disableOn )
return true;
if(e.type)
e.preventDefault();
// This will prevent popup from closing if element is inside and popup is already opened
if(mfp.isOpen)
e.stopPropagation();
options.el = $(e.mfpEl);
if(options.delegate)
options.items = el.find(options.delegate);
mfp.open(options);
this.smugSmugLinkClick(el);
,
///OPEN SMUGMUG LINKS FROM DIV CLICK
smugSmugLinkClick: function(el)
**///FEEL FREE TO POST CODE IN HERE TO MAKE THIS WORK**
,
And here is the array of web links
///SmugMug Links to iterate over for Gallery Page
var smugMugLinks = [
"https://xxx.smugmug.com/Gallery/photo1",
"https://xxx.smugmug.com/Gallery/photo2",
"https://xxx.smugmug.com/Gallery/photo3",
"https://xxx.smugmug.com/Gallery/photo4",
];
------------------------------------------------------------------------------------------------------------------------------------EDIT: Answers still accepted, but some spaghetti code did the trick for this one isolated incident:
///DIV INDEX --> SMUGMUGLINK INDEX
if (window.location.pathname === "/gallery/")
const childs = $(e.currentTarget).parent().parent().parent().children()
const href = $(e.currentTarget).attr("href")
childs.each((i, element) =>
const divHref = $($(element).find("div")[0]).find("a")[0].href
if (divHref === href)
window.open(smugMugLinks[i])
)
javascript jquery wordpress magnific-popup
EDIT: I've solved my question by rigging some code together. Answers still welcome, but I've solved this for the time being. See the last section for the code.
------------------------------------------------------------------------------------------------------------------------------------
I'm attempting to open a given div that corresponds to an index within an array of web links.
The concept is simple: the divs contain a photo, and when the photo div is selected, magnific popup will do its thing and then open the corresponding link from the index.
Unfortunately, I am only able to get divIndex[0] and webLinkIndex[0] to open on any given div click selection.
If I'm not being clear enough, I apologize; if there are questions, please ask me to clarify.
I used developer tools to narrow down where the click is occurring and attempted to make my own function to handle this.
Feel free to make any modifications.
Code snippets below:
//CLICK FUNCTION
_openClick: function(e, el, options) e.metaKey ) )
return;
var disableOn = options.disableOn !== undefined ? options.disableOn : $.magnificPopup.defaults.disableOn;
if(disableOn)
if($.isFunction(disableOn))
if( !disableOn.call(mfp) )
return true;
else // else it's number
if( _window.width() < disableOn )
return true;
if(e.type)
e.preventDefault();
// This will prevent popup from closing if element is inside and popup is already opened
if(mfp.isOpen)
e.stopPropagation();
options.el = $(e.mfpEl);
if(options.delegate)
options.items = el.find(options.delegate);
mfp.open(options);
this.smugSmugLinkClick(el);
,
///OPEN SMUGMUG LINKS FROM DIV CLICK
smugSmugLinkClick: function(el)
**///FEEL FREE TO POST CODE IN HERE TO MAKE THIS WORK**
,
And here is the array of web links
///SmugMug Links to iterate over for Gallery Page
var smugMugLinks = [
"https://xxx.smugmug.com/Gallery/photo1",
"https://xxx.smugmug.com/Gallery/photo2",
"https://xxx.smugmug.com/Gallery/photo3",
"https://xxx.smugmug.com/Gallery/photo4",
];
------------------------------------------------------------------------------------------------------------------------------------EDIT: Answers still accepted, but some spaghetti code did the trick for this one isolated incident:
///DIV INDEX --> SMUGMUGLINK INDEX
if (window.location.pathname === "/gallery/")
const childs = $(e.currentTarget).parent().parent().parent().children()
const href = $(e.currentTarget).attr("href")
childs.each((i, element) =>
const divHref = $($(element).find("div")[0]).find("a")[0].href
if (divHref === href)
window.open(smugMugLinks[i])
)
javascript jquery wordpress magnific-popup
javascript jquery wordpress magnific-popup
edited Nov 10 at 4:26
asked Nov 10 at 2:37
pythlang
84113
84113
add a comment |
add a comment |
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53235562%2fmagnific-popup-open-link-from-array-corresponding-to-respective-photo-div%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown