When I uploads a image into the page using Add Media, I am setting url for that image, so that when user clicks on that image he should get redirect to another page. problem is, is get loading on same page.
I want it should get load in to another tab. I can't edit each href with target="_blank" as i have lots of images.
I just want to know is there any particular php file that should I edit or any other way is there.
Please help me to solve this problem
<script>
$(function(){ $("a img").attr("target","_blank"); });
</script>
Add this in <head>.
It's easy to set target="_blank" for images:
Click an image to activate its settings pop-up window.
Click the Advanced Settings tab.
Scroll down to "Target" and you'll see the "open in a new window" checkbox there.
For old images, you'll have to make the change manually.
Hope this helps!
You could use JavaScript window.open(), like:
function imgWin(win, winName, imgArray){
var dot, hsh;
for(var i=0,l=imgArray.length; i<l; i++){
(function(i){
dot = imgArray[i].lastIndexOf('.');
hsh = imgArray[i].slice(0, dot);
imgArray[i].onclick = function(){
open(win+'#'+hsh, winName, 'resizable=1');
}
})(i);
}
}
Then you could even get your images easily, like:
var imgs = document.getElementsByTagName('img');
imgWin('imgwin.php', 'My Images, imgs);
Note, that window is implicit, so you dont actually need to writewindow.open().open()` will work fine, in this case.
Related
I'm using slider and having it open up on a specific image when the page loads. That happens just fine, only when I go to select another image it stays visible as the other one also pops up.
Here is my current code for forcing it to appear.
<script>
$(document).ready(function(){
$("#793").show();
});
</script>
the page can be seen here, select another image at the bottom and you'll see what I mean.
http://www.shehitpausestudios.com/index.php/shop/polaroids/girls-and-dreams/last-summer/
maybe try something like this
$(".bjqs li div").click(function(){
$(".person_about").hide();
var image = $(this).attr("data-rel");
var div = image.replace('#','');
$(".person_about #"+div).show();
return false;
});
I'm just curious if things like this is possible >> While still loading a web page, is it possible to return an onbeforeunload like dialog when a user try to navigate to other page or close the browser ?
Well i made this to display a message to be display before someone quits my site, and this gives them the option to stay or leave the page.
I used jquery so you have to add the link to jquery to your site, yo can do this calling a script tag with the src pointing to the next url:
https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
and after that just add the next code on your webpage
$(document).ready(function()
{
var flag = true;
function Close()
{
if(flag)
{
return "Are you sure you want to leave?";}
}
}
window.onbeforeunload = Close;
});
This will call the Close function at the onbeforeunload event, and will ask if you want to leave or stay
Hope this helps
The thing is I have this set of code that exports a PDF file, I used TCPDF on this one.
$('#export').click(function() {
var conf = confirm("This will generate a PDF file of all the list of products. Continue ?");
if (conf)
{
$('#ajaxloader').css('visibility', 'visible');
var href = "http://"+url+"/export/items.php";
window.open(href, '_self');
}
});
When I click the button, it downloads the pdf file that contains a list of products, but my problem it's taking about more than 30 seconds to render, I already set the time limit so I'll no problem with that, what I want to do is to display a loader while rendering the pdf file, then hide it afterwards.
I'm working on an ajax loading function on a Wordpress single page portfolio.
The principle is that when you click a thumbnail in the gallery, it opens a container (#DrawerContainer) and fetch the ajax content of this article into it. With a lot of help, I'm already able to open the drawer and load the post content when I click a thumbnail.
Here is a fiddle if you want to see it working (the ajax will not load but it works locally). http://jsfiddle.net/RF6df/24/
The part I'm working on now: I need my site to be crawlable and the urls to be shareable. If I give http://mywebsite.com/#!project5 to someone, I need project5 content to be opened when he loads the page.
I thought the hash-bang (#!) urls was the way to go to make this work. With the code below (commented on the jsfiddle), I can update the url and add the hash of the clicked thumbnail.
var pathname = $(this).find('a')[0].href.split('/'),
l = pathname.length;
pathname = pathname[l-1] || pathname[l-2];
window.location.hash = "#!" + pathname;
But when I load a page, the ajax state isn't remembered. I assumed it was because my ajax container was only loaded on click event, but there is no change when I add a persistant container in the php.
Is there a way to load the page with a post content already displayed, or to open the #DrawerContainer when the page is loading a hash-bang url?
Please keep in mind that I'm just learning jquery and ajax. So I'd really appreciate if you explain or comment a little bit what you do, I'll for sure learn at the same time... :)
on onload you should check the window.location.hash and trigger a click on the particular link/div.
$(document).ready(function() {
var hash = window.location.hash;
if ( hash.length > 0 ) {
hash = hash.replace('#' , '' , hash );
$('a[rel="'+hash+'"]').trigger('click');
}
});
I have used the following on sites where I want to trigger via hash changes.
First I bind a hashchange event to get the hash value
$(window).bind('hashchange', function(o){
url = window.location.hash.substring(1);
o.preventDefault();
if (!url) {
return;
}
}
Then I trigger the hashchange when I want - in your case when the page loads i.e. on document ready.
jQuery(document).ready(function($) {
$(window).trigger('hashchange');
});
You can then use the hash value in your function that loads the correct content
I have a single php script on my site that facilitates my site's downloads (logs user info, controls user permissions etc). A typical link looks like this on my site:
Download file 12345
In file_download.php I check to make sure the file request is valid, and if so, it does a header force file download
header("Content-type: application/force-download");
which forces the download prompt in the user's browser. The user never leaves the page they click the link on.
What I am wondering is if I am able to toggle a jQuery event from file_download.php onto the parent page? It seems if I do anything on file_download.php other than a 'header force download' the user will leave the page.
Ideally I would like to keep my href links unchanged (for the sake of not editing a million instances site wide) and have file_download.php toggle a lightbox window prompting for user information before the download (if needed of course).
Any help or suggestions would be greatly appreciated, thanks.
You wouldn't need to toggle the event from the PHP page, you could attach the information box to all of your download links, and then use JavaScript to redirect:
var downloadLink;
$(".download-link").click(function(e){
e.preventDefault();
downloadLink= $(this).attr("href");
displayLightbox();
});
$("form").submit(function(e){
e.preventDefault();
//form validation
if(formValidated = true){
window.location = downloadLink;
}
});
I have an example like the above one.
This is your link :
<a id="downloadLinkId" href="file_download.php?file_id=12345">Download file 12345</a>
And this is your javascript:
$("#downloadLinkId").click( function(event) {
event.preventDefault();
launchLightBoxWindow();
});
Rest of the code is on jsfiddle.
I got videos list using AJAX, and me want to play a top video an a light box? So after viewing list how it is possible to play video automatically?
html code
<a id="a_lnk" href="http:\\www.cnn.com">cnn</a>
javascript code
// find a <a> element with id a_lnk
var lnk = document.getElementById('a_lnk');
lnk.onclick = function(e){
// do the magic here..
// e.target is the object that got the click
window.location = e.target.getAttribute('href');
return false;
}
complete example here
http://jsfiddle.net/eAFWY/26/
can also be done with jQuery if that is your thing
http://api.jquery.com/click/