I am working on a Wordpress site using the Vanilla forum plugin. I found HTML code below after I checked firebug:
<ul>
<li>Diets That Work</li>
<li>Heart Disease Support</li>
</ul>
I have only have a problem in Safari browser; when I click either of the first two links, it goes to http://knowmoretv.com/discussions-4/ but if use any other browser it goes to http://knowmoretv.com/discussions-4/#/discussion/73/diets-that-work (or heart-disease-support, as I'd expect).
Should i use jQuery code redirect # to /# in safari browser?
i have fixed that problem by jQuery for Safari browser
<script type="text/javascript">
$(document).ready(function(){
$.browser.safari = $.browser.webkit && !window.chrome;
if ($.browser.safari) {
$("a").click(function(event){
event.preventDefault();
var urlval = $(this).attr('href').split('#');
var urlvals = urlval[0]+'/#'+urlval[1];
var pathname = window.location.pathname;
if(pathname == '/discussions-4/')
{
window.location.assign(urlvals);
window.location.reload(true);
}
else{
window.location.assign(urlvals);
}
});
}
});
</script>
Related
I can not get this jQuery to work on page load? I use fancybox 3.
<script>
function openFancybox() {
setTimeout( function() {
$('[data-fancybox data-src="#newsletterFancy"]').trigger('click');
}, 20000);
}
$(document).ready(function() {
var visited = $.cookie('visited');
if (visited == 'yes') {
return false;
} else {
openFancybox();
}
$.cookie('visited', 'yes', { expires: 7 });
$('[data-fancybox data-src="#newsletterFancy"]').fancybox();
});
</script>
I have also added this to my body tag: <body OnLoad="openFancybox()" class="body">
I basically have my pop up in a included file called newsletter.php. The link in my sidebar works fine when i click that. But i want to make it pop up and open on page load with a delay and also for it to set a cookie.
I have also included the cookie js as well:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
This is the line I use in my sidebar link for it to open when you click it:
<a class="buttons" data-fancybox data-src="#newsletterFancy" href="javascript:;">Newsletter Subscribe</a>
Thanks
You are simply not using valid selector. Replace
$('[data-fancybox data-src="#newsletterFancy"]')
with, for example:
$('[data-src="#newsletterFancy"]')
I have a pagination that I did only with php, but now Im trying to do my pagination using ajax and some fade effects.
I have this link in my index.php to pass my BASE, that is my htttp://localhost/project url to jQuery:
<link rel="nofollow" title="base" href="<?php echo BASE; ?>" />
Then I have my jQuery function that works when I click in my pagination link.:
$(function(){
base = $('link[title="base"]').attr('href');
urlaction = base+'/actions';
alert(urlaction);
$('#body-content').on('click','.paginator a',function(){
if($(this).hasClass('active')){
return false;
}else{
$('#body-content .paginator span').css({color:'#FFF','border-color':'#fff'});
$('#body-content .paginator a').removeClass('active');
$(this).addClass('atv');
var url = $(this).attr('href');
var data = url.lastIndexOf('/') + 1;
var data = url.substr(data);
$('#body-content .news').fadeTo(500,'0.2');
$.post(urlaction,{action:'article_pagination',page:data},function(pagination){
alert(pagination);
$('html, body').delay(500).animate({scrollTop:$('h2').offset().top},500);
window.setTimeout(function(){
$('#body-content').html(pagination);
$('#body-content .news').fadeTo(500,'1');
},600);
});
}
return false;
});
});
If I alert my alert(urlaction) I get my localhost/project/actions, so its correct it is my url to my actions.php file.
But when I do my alert(pagination); I get my alert with all code that I have in my index.php inside alert box, so it seems that is not getting the correct path to my actions.php file. But The path is correct...
Do you see what can be wrong here??
My alert appears like:
<!DOCTYPE html...>
<html xlmlns>
....
and all my index.php content
I am guessing you are missing the $ before BASE and are seeing an error page alerted back to you with that info.
Right now I have this list:
<ul id="list">
<li id="active"><img src="main home page/purhome.png"></li>
<li id="active"><img src="main home page/purinfo.png"></li>
<li id="active"><img src="main home page/purgyms.png"></li>
<li id="active"><img src="main home page/purcontact.png"></li>
</ul>
And this JQuery:
$(document).ready(function(){
$("#home-link").click(function(){
$("#main_info2").hide();
$("#main_info").show();
});
$("#info-link").click(function(){
$("#main_info").hide();
$("#main_info2").show();
});
$("#gyms-link").click(function(){
$("#main_info").hide();
$("#main_info2").show();
});
$("#contact-link").click(function(){
$("#main_info").hide();
$("#main_info2").show();
});
});
When I click on the home link, the URL shows indexp.php#home, which is what i want it to show. This happens for all the links. However if i refresh the page after i click on the info link for example, the main_info div is shown, but the browser still says index.php#info. I want to read the hash somehow to show the correct div depending on what the url says.
So for example if I click on the info link, the url shows index.php#info. When I refresh it says the same thing but the main_info div shows when the main_info2 div is supposed to be showing.
function getHash() {
var hash = window.location.hash;
return hash.substring(1); // remove #
}
So I have that code. Would I do something like this?
if hash = 'info' // if url says index.php#info
show main_info2
hide main_info
if hash = nothing // So if url says index.php
show main_info
hide main_info2
Any ideas?
EDIT**
I'm trying to do something like this to make it work:
var currentValue = window.location.hash.substr(1)
$(document).ready(function() {
$("home-link").click(function(){
if(currentValue == "home") {
$("#main_info2").hide();
$("#main_info").show();
}
});
$("info-link").click(function(){
if(currentValue == "info") {
$("#main_info").hide();
$("#main_info2").show();
}
});
});
Although that is not working, can someone check the code?
You can use this jQuery plugin to listen to hash changes:
https://github.com/cowboy/jquery-hashchange
I would recommend using a plugin if you want your code to work cross browser because this hasn't been standardized yet. Especially older browsers (IE6) require extensive hacks.
After some discussion about the different answers and problem, I came up with this solution:
$(document).ready(function(){
$(window).hashchange(function(){
var hash = location.hash;
if(window.location.hash.substr(1) == "home") {
$("#info-container").hide();
$("#gyms-container").hide();
$("#contact-container").hide();
$("#home-container").show();
}
else if(window.location.hash.substr(1) == "info") {
$("#home-container").hide();
$("#gyms-container").hide();
$("#contact-container").hide();
$("#info-container").show();
}
else if(window.location.hash.substr(1) == "gyms") {
$("#home-container").hide();
$("#info-container").hide();
$("#contact-container").hide();
$("#gyms-container").show();
}
else if(window.location.hash.substr(1) == "contact") {
$("#home-container").hide();
$("#info-container").hide();
$("#gyms-container").hide();
$("#contact-container").show();
}
$('#list a').each(function(){
var that = $(this);
that[ that.attr( 'href' ) === hash ? 'addClass' : 'removeClass' ]( 'selected' );
});
})
$(window).hashchange();
});
This work beautifully.
This uses the hashchange plugin mentioned above so make sure you insert the script into your head before using this function.
Here is bit of code to help you get started if you use https://github.com/cowboy/jquery-bbq:
$(document).ready(function(){
$("#home-link").click(function(){
$("#main_info2").hide();
$("#main_info").show();
});
$("#info-link").click(function(){
$("#main_info").hide();
$("#main_info2").show();
});
$("#gyms-link").click(function(){
$("#main_info").hide();
$("#main_info2").show();
});
$("#contact-link").click(function(){
$("#main_info").hide();
$("#main_info2").show();
});
$(window).bind( 'hashchange', function(e) {
url = $.deparam.fragment();
url && $( 'a[href="#' + url + '"]' ).trigger('click');
});
$(window).trigger('hashchange');
});
On Codeigniter I have a code
HTML
//ROOTPATH is the constant Path and $recordId is coming from a loop.
Delete
Javascript
windowRedirect(url,msg)
{
if(confirm(msg))
{
window.location.href = url;
}
else
{
return false;
}
}
I have written a simple javascript which will redirect url if user click on OK button but I am getting weird problem on Google chrome where this code is working perfectly on Mozila Firefox, IE 8/9 and Applae Safari. Can any one tell me how can I solve this Google Chrome Problem.
Though I have a doubt this script is probably not working because of '#' on the href field but I am not sure.
Here is an working example:
<html>
</head>
<script>
function window_redirect(url,msg)
{
if(confirm(msg))
{
window.location = url;
}
else
{
return false;
}
}
</script>
</head>
<body>
<a onclick="window_redirect('http://www.google.com','Are you sure you want to Delete');" href="#" >Delete</a>
</body>
</html>
You forgot to call state 'function' before function, also if you put onclick on a element (link) always put it before href="#" some browsers will not call onclick if that is not the case.
I am using below code for automatically redirect to the page in a fraction of seconds.
<script language="Javascript" type="text/javascript">
<!--
var testTimerID;
testTimerID = window.setTimeout(autoDirect, 30*250 );
function autoDirect() {
window.location = 'home';
}
</script>
This script works fine in all browser except in safari browser.it does not automatically redirect to the another page(home). what is the issue?.how can i solve it?.
Try it like this:
<script language="Javascript" type="text/javascript">
//<!--
var testTimerID;
testTimerID = window.setTimeout(function(){
window.location.href = '/home';
}, 30*250 );
//-->
</script>
Usually JS does not work properly and in same way through all the web browsers... Therefore I advise to use jQuery as it is debugged for all common browsers...
Try aslo reading through this: How to redirect to another webpage in JavaScript/jQuery?
Also instead of relative URL You shoudl use absolute like http://www.mydomain.com/home/, so the code should be:
...
window.location.href = 'http://www.mydomain.com/home/';
...
.
This works perfectly in Safari 5 for windows
<script language="Javascript" type="text/javascript">
var testTimerID;
testTimerID = window.setTimeout(autoDirect, 30*250 );
function autoDirect() {
window.location = 'http://google.com/';
}
</script>