We Keep Coding

How to override jquery _blank?

I'm including a widget in a page using PHP. The widget includes the following jQuery code, which is making all links open in an external page. Is there any way to override or neutralize this code so it no longer affects all links on the page?
Ideally, I'd like to wrap the widget in a div and specify those links to open in a _blank.
I am new to jQuery, so I appreciate any help offered.
$(document).ready(function() {
// change all links to open outside iframe
$("a").each(function(index) {
$(this).attr("rel", "external").attr("target","_blank");
});
});

If you do as you say and wrap your widget in a div like this:
<div class="container">
<!-- Your widget -->
</div>
You can select only the links inside that container like this:
$(".container a").each(function(index) {
$(this).attr("rel", "external").attr("target","_blank");
});
.container a selects anchor elements (links) that are children to that containing div, and will run your function on them.

Try it code
$(window).ready(function() {
$("a").each(function(index) {
$(this).attr("rel", "external").attr("target","_blank");
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Peace of Paris

Disable Parent Menu Item Fails in Responsive

I'm self-taught when it comes to web design and so I really am stuck here because I don't have the framework for understanding the problem. My website (sealinesd.com) is OK EXCEPT the parent links should be disabled AT ALL TIMES. Right now it works like this:
-- when the regular non-responsive menu is up, the parent links are disabled thanks to the plugin I use (code below).
-- when you hover on the non-responsive menu and the parents are disabled, and THEN you make the browser smaller, the responsive items you hovered on before are still disabled.
-- when you go straight to the responsive menu without first hovering on the parents in non-responsive mode, the parent links are NOT disabled.
I have very little knowledge of jquery and DOM so I was unable to fix the plugin. I tried to target the mean-menu (used in responsive mode) and use document.ready to make sure it wasn't executing too early, or something, but neither worked for me. Please advise. I thank you kindly in advance.
The code for the plugin I use to disable parent links is right below.
Plugin Name: Advanced Disable Parent Menu Link
Description: A plugin which allows you to disable parent menu link.
Author: Kapil Chugh
Plugin URI: http://kapilchugh.wordpress.com/
Version: 1.0
add_action('wp_footer', 'advanced_disable_parent_menu_link');
function advanced_disable_parent_menu_link () {
wp_print_scripts('jquery'); ?>
<script type="text/javascript">
if (jQuery("ul li.page_item:has(ul.children)").length > 0) {
jQuery("ul li.page_item:has(ul.children)").hover(function () {
jQuery(this).children("a").removeAttr('href');
jQuery(this).children("a").css('cursor', 'default');
jQuery(this).children("a").click(function () {
return false;
});
});
} else if (jQuery("ul li.menu-item:has(ul.sub-menu)").length > 0) {
jQuery("ul li.menu-item:has(ul.sub-menu)").hover(function () {
jQuery(this).children("a").removeAttr('href');
jQuery(this).children("a").css('cursor', 'default');
jQuery(this).children("a").click(function () {
return false;
});
});
}
</script> <?php
}
I tried this code too and it didn't work. I'm frustrated. Don't know how to target that damn responsive menu.
wp_print_scripts('jQuery'); ?>
<script type="text/javascript">
jQuery(document).ready(function () {
if (jQuery("nav.mean-nav > li:has(ul.children)").length > 0) {
jQuery(".mean-nav > ul > li:has(ul.children)").hover(function () {
jQuery(this).children("a").click(function(evt) {
evt.preventDefault();
});
jQuery(this).children("a").css('cursor', 'default');
}
});

I took a look at your site. It appears to be built from a template that has created its own responsive functionality.
Personally, I would suggest that you look into using Bootstrap to build your own pages. Bootstrap is extremely easy to implement once you understand the 12 column grid system.
Bootstrap has responsive menus with dropdowns like this all rolled in out of the box and it works great, see this example
You could easily duplicate the look of your template using bootstrap in very little time and there are TONS of resources online to help you.
Anyway, that said, if you want to to stop a click on a link from navigating to the link's href location you can use .preventDefault(); like this:
// prevent navigation when clicking links with the class preventDefault
$(document).on('click', '.preventDefault', function(e){
e.preventDefault();
});
// just to show that other events still make it through
$('#test').click(function(){
$('#result').append('click detected<br>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Click this link<br>
<div id="result"></div>

How can i keep the Menu open with JavaScript and HTML?

i have a SideBar Menu, how can i keep it open? If you go to the page, the Menu is closed and i must click on the Menu Button, to toggle it on. How can i keep it open, i'll close it myself.
Code:
<script type="text/javascript">
$('#nav-btn').click(toggleMenu);
$('main').click(function() {
if ($(this).hasClass('active')) {
toggleMenu();
}
});
function toggleMenu() {
$('#nav-btn, #sidebar, main, #cover').toggleClass('active');
}
</script>

for better practice, write your code inside a .js doc and put your code inside a
$( document ).ready(function() {
// Your code here
});
And not inside a <script> tag..
You can just add the active classes inside the HTML element (wihthout jQuery), if debugging is the purpose.
Try replacing toggleClass with addClass, should help.
Please edit your question and provide the full code (html & css) so we can help you further

The focus is not moved on the top of the page

I am using update panel and pagination links by repeater control at the bottom of the page. Now when we click on pagination links, the page is not focused on the top of the page. I have tried the folllowing jquery code
<script type="text/javascript">
$(document).ready(function () {
$("#<%=rptPager.ClientID %> a").click(function () {
parent.window.scrollTo(0, 0);
});
});
</script>
but it doesnot work... Please help me!!!

i think you were looking for window.scrollTo(0, 0);
parent.window.scrollTo(0, 0); won't work in your code, since parent will be undefined.
this.parent however, would point to the parent of the element you clicked.

two uses of jquery conflict with eachother

on this site, I have 2 uses of jquery, one for "anything slider" and another for a toggle for hide show.
http://www.worklightrpo.com/
If I remove the toggle's link to jquery, the slider works, but the toggle doesn't... this is the link for the toggle's jquery.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
Does anyone know how I can get them BOTH to work and play nicely?
Thanks
The full portion of code is this:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script>
$(document).ready(function() {
$('.nav-toggle').click(function(){
//get collapse content selector
var collapse_content_selector = $(this).attr('href');
//make the collapse content to be shown or hide
var toggle_switch = $(this);
$(collapse_content_selector).toggle(function(){
if($(this).css('display')=='none'){
toggle_switch.html('Learn More');//change the button label to be 'Show'
}else{
toggle_switch.html('Condense');//change the button label to be 'Hide'
}
});
});
});
</script>

Don’t load two different javascript library versions, only one is ever needed.