Make Links Work With ContentEditable Attribute
Hi all, I was able to edit my webpages using HTML5 ContentEditable attribute and an Iframe. Basically I have a page with an Iframe which is used to open any webpage in my domain. Then when a page is opened it can be edited by adding the ContentEditable attribute to the body element of that page. The problem is I cannot navigate to other pages by clicking on the links on the page if the ContentEditable attribute is set to true. Is there a way around this without removing the ContentEditable attribute?
ajax.done is empty
I have a problem with ajax that doesn't seem that common. I found very few other posts with the same issue as mine and tried fixing it with replacing the 'return' with 'echo' in my php file and adding the type property to my ajax request. But no matter what I do, my 'data' is always empty. When I set the value directly, without ajax, like this: var data = <?php require "script.php"; $link = createConnection(); $result = mysqli_query($link, "SELECT * FROM Snippets"); $output = array();
how to make dragged element droppable again
I am using Jquery UI and creating drag and drop feature. I have div element which can be dragged and then once it is dragged, user can add images to this dragged div element. This is how my code is setup $("#dvSource img").draggable({ //containment: '#gbox', cursor: 'move', helper: 'clone', scroll: false, connectToSortable: '#edit, #edit1, #mainContentDiv' , //appendTo: '#edit', start: function () {}, stop: function (event, ui) {}
Menu for uploading from a web URL or from ones computer
I am trying to reproduce on my homemade site a feature that I have seen on many forums, namely a pop-up menu that allows the user to upload a file either from a URL or from the user's computer. (thus, what I am looking for is exactly like what happens when the portrait icon is clicked at http://math.stackexchange.com/questions/ask for example). The nearest I could reach so far is the very incorrect and very ineffective code below. Any help appreciated. <!doctype html> <html lang="en"> <head>
Check if drop-down box is select.
Hi everybody, I would like to check if a select option is selected. I mean I have a this html form: <form style="background-color:#EEE; padding-left:5px; font-weight:100;" id="presenzeH" action="presenzeH.php" name="frmComune" method="post"> <label id="data">Mese:</label> <select name="mese" id="mese" size='1'> <option value="0" style="padding-left:5px;">Seleziona il mese</option> <option value="9" style="padding-left:5px;">Settembre</option> <option
jQuery Performance
Hi, I was wondering which would improve performance when removing elements? Multiple Selectors $("#id1, #id2, #id3").css("display","none"); or Multiple Lines $("#id1").css("display","none"); $("#id2").css("display","none"); $("#id3").css("display","none"); Thanks.
keyup event fires on element that is updated from another element???
I have 3 elements. An update button (initially hidden), the code editor element and a preview div element. The preview div's innerhtml is updated from the codemirror "update" event. This is working great. The preview div is set contenteditable="true" and I detect keyup events using the "on" delegate method from the body since it is added to the dom by the codemirror instance after page load. The update button is revealed when the keyup event is detected on the preview div so I can pass the updated
bxslider bad animation problem
hi, My bxslider scripte works perfectly but i have a problem in bxslider animation when i click in the "bx-prev" button exemple if i go to image 1 to 4 ( previous ) my problem demo www.askdesigngroup.com/BxSliderProblem.rar
How do I add another table at the bottom of screenshot below?
Thank you very experts for your continued assistance. The screenshot below is as a result of this fiddle courtesy of kwood and the great JAKE. How do I modify code below to add the portion that begins with Related Work Activity? $("#emps").on("click", "a[target='tab']", function(){ var me = $(this); var url = me.attr("href"); var tabName = me.data("tabName"); var tabIndex = parseInt(me.data("tabIndex"), 10); $.get(url, function(data) { var table = $( '<table id="details" class="details"
Hover one a element change other elements
I will explain my problem guys. Lets suppose this is html ~~~ <ul> <li><div class="smiles"><a>Test</a></div></li> <li><div class="smiles"><a>Test</a></div></li> <li><div class="smiles"><a>Test</a></div></li> <ul> ~~~ What i want to do is, when hover on one element that specific element will change style, also the other two that are not selected must change style, and so on. i can make it work by saying $(this).addClass()... and then by changing other elements class but i don't
Jquery Pluggin shell
(function($) { }(jQuery)); guys the above is the normal plugin "Shell" in which all the Jquery plugin code goes ! But its really really hard to understand what exactly that shell is doing ? now i read about how that shell is suppose to avoid conflict with other javascript on the page and how the ($) might be used by another library . but that Jquery plugin shell , still does't make any sense . i am asking this question because as a developer i really feel the need to know that that little snippet
Building a drag and drop UI, positioning draggable to nearest droppable.
I've pulled and put some code together to position draggable elements on a grid of droppable elements. The droppable grid is made of units (a * b) and the draggable element is (2a * b). I'm hoping to eventually record positions on the grid in a database in order to save positions for future logins. I've pulled some code together, but I'm struggling to make it work nicely. I want the left side of draggable to line up with the closet left side of a droppable grid unit. The problem is that the left
on click from link imported
I am trying to set html when a link is clicked on. I found out that .on should work. Here are my two pages that I have setup for testing: <script> $(function() { $("#search").on( "click", function(){ $.ajax({ url: 'process.php', data: { test : 1}, type: 'post', success: function(output) { if(output){ $('#stuff').html(output); } } }); }); $('[id^="delRec"]').on( "click", function(){ alert('good'); e.preventDefault();
Adding more textareas
Hello, im using wysibb editor.. And now im trying to make an article page, and the user should be able to add more pages.. But i cant get the editor to work only on that on that already exists when you get to the page $(".textarea").wysibb(wbbOpt); /* Lägg till en ny sida */ $(".addPage").click(function() { var nextTab = $("#myTab li").size()+1; $('<li><a href="#tab' +nextTab+'" data-toggle="tab">Skriv i en rubrik
KeyboardEvent.key value "Left" is obsolete and will be renamed to "ArrowLeft
Hi, Firebug is reporting the following warnings after the right or left arrow keys are depressed: KeyboardEvent.key value "Right" is obsolete and will be renamed to "ArrowRight". For more help https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent.key event[ prop ] = originalEvent[ prop ]; jquery.js (line 4564) KeyboardEvent.key value "Left" is obsolete and will be renamed to "ArrowLeft". For more help https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent.key event[ prop ] = originalEvent[
send cropped image info to a php page
hello. i used of cropit: http://scottcheng.github.io/cropit/ now i want to send cropped image x and y and the zoom amount to a php page. i don't know how. and i don't know do it with jquery only or i must use of php also? thanks.
Set the sequence in div using jQuery
I have a json and i am creating div based on json data. In the json I have level(depth) field. Level value are like 0, 0 ,1 ,2,0, 0,1,2,3. I am creating html and passing level into the div attribute. Now based on level (Depth) I need to create/generate the number. I want the exact output which you can see the below. I am looking for jQuery solution. <div level="0">1</div> <div level="1">1.1</div> <div level="1">1.2</div> <div level="2">1.2.1</div> <div level="2">1.2.2</div> <div level="2">1.2.3</div>
Required help on JQUERY plugin for CGM Viewer
Hello There, I would like to know if there is any jquery plug-in for CGM(Computer Graphics MetaFile) available . Help required ASAP Nandita
how can i set Checkbox on /off slider in javascript or jquery..
$(document).ready( function(){ $('.toggle_btn').click(function(){ // on off classes if($(this).hasClass('on')){ $('.toggle_btn').animate({'backgroundPositionY':'0px 0px'}, 1000, 'linear', function(){ $(this).removeClass('on'); $(this).addClass('off'); }); // on off classes else condition } else{ $('.toggle_btn').animate({'backgroundPositionY':'0px 150px'}, 1000,'linear', function(){
dedupe html table with jquery
i want to do that before dedupe <table id='tableau'> <thead> <tr><th>reference</th><th>Nom</th><th>Ville</th><th>Code Postal</th><th>Email</th><th>Telephone</th><th>Derniere Modification</th><th>Identifiant</th><th>Mot de passe</th></tr> </thead> <tbody> <tr><td>000000</td><td>dubois</td><td>Paris</td><td>75000</td><td>maill@mail.fr</td><td>0102030405</td><td>2014-09-22</td><td>azerty</td><td>querty</td></tr> <tr><td>111111</td><td>dubois</td><td>Paris</td><td>75000</td><td>maill@mail.fr</td><td>0102030405</td><td>2014-09-22</td><td>azerty</td><td>querty</td></tr>
jQuery don't work with my index.html
I want the buttons on my page to fadeTo opacity 0.7 when i hover my mouse on it and back to 1 when i take my mouse away. But it doesn't work. Heres my code (index.html): <!DOCTYPE html> <html> <head> <title>For Fun HTML/CSS</title> <link rel="stylesheet" type="text/css" href="main.css"> <link rel="shortcut icon" type="image/icon" href="/images/favicon.ico"> <script type="text/javascript" src="script.js"></script> </head> <body> <header> <nav> <h1 class="titleh1">Enon's Homepage</h1> <ul class="navBar">
Vertical News Slider Plugin not working correctly -
Hello. I have some issues with using the vertical news slider plugin that I secured from here: https://github.com/impressivewebs/vertical-news-slider [if you just download the working sample from there you can see the code. It is not so complex.] Now I did the server side code and all [with C#] which is fetching the desired data from database correctly, as per my logic. No problem there. Then I go to integrate the fetched data with this plugin, so that the slider animation effect is created. See
Uncaught TypeError: undefined is not a function
Hello, I'm using b.popup but on click its showing error Uncaught TypeError: undefined is not a function, Uncaught ReferenceError: jQuery is not defined how can i solve it source is http://www.housingmilitary1st.com/
FadeIn and FadeOut problem with smooth transitions
I built a site using FadeIn and FadeOut to phase in and out divs, but when I load the page from my portfolio site a bunch of the divs that are .hide() flicker on the screen and it doesn't look smooth. (it doesn't happen everytime, so try again if it doesn't happen first time) I've been stuck on this problem for awhile so if anyone knows how to resolve this please let me know. Demo: http://www.andrewhnovak.com and click the right box called Andy's Botany
Why can't I select SVG Polygon using Attribute[ID] ?
I am trying some simple hover effects on some svg. ~ When i hover on a button the target SVG gets animated. I am using Velocity,js for this project with jQuery. For Button, <button data-targetX ="firstTra"></button> This works, $('svg polygon[id="firstTra"]').velocity({opacity:1}); But this does not, var meinTarget = $(this).attr('data-targetX'); //button's data attr $('svg polygon[id=meinTarget]').velocity({opacity:1}); However
JQuery UI Accordion
Hello, I don't know if this is the place to ask but I tried to google my problems and no good solutions and I'm very new to Jquery. Here goes. I did an FAQ using this method below: http://api.jqueryui.com/accordion/#entry-examples the CSS hrefs are: 1. jquery-ui.css 2. structure.css the script hrefs are: 1. the latest jquery file from the website 2. jquery-ui-js The end results it, it works perfectly for Firefox but doesn't work at all for Chrome and IE(10). Can help me with this? Thank you
How to validate indivivual accordion?
I have accordion that works similarly like this: http://jqueryui.com/accordion/ The only difference is we are have textboxes for users to enter data and dropdowns to select data from. Once a user completes the process on each accordion, the user clicks the next accordion and continues the process. The issue we have now is we have not figured out a way to validate form fields on each accordion in such that a user cannot go to another accordion until all textboxes are filled and selections made from
how to call jquery UI datepicker using function?
i have 5 textboxes for datepicker. i need to call datepicker through this function. <tr> <td>Date</td> <td> <input type='text' readonly name="EXPDT1" id='EXPDT1'><img src="calendar.gif" name='imgCalendar' id='dat_img' onclick="return showCalendar('EXPDT1')" > </td> </tr> <tr> <td>Date</td> <td> <input type='text' readonly name="EXPDT2" id='EXPDT2'><img src="calendar.gif" name='imgCalendar' id='dat_img' onclick="return showCalendar('EXPDT2')" > </td> </tr> <tr> <td>Date</td> <td> <input type='text'
open DIV after the website draws.
I want a window to open a second or so after the main website completes opening. I am able to do the below BUT can only seem to get it to work from a button click I want this to happen automattical ONCE the window is done rendering Thoughts? $( document ).ready(function() { $('#PrintService').click(function(event) { $('#divLayerContainerPrint').delay(800).show('slow', function() { // Animation complete. }); }); }); <div id="divLayerContainerPrint" class="divLayerContainerPrint
can variables be declared directly with this keyword ??
guys i a few questions about the code in the below pluggin : Scrolly.js : its basically a parallax plugin . now if you check line 15 to 25 . see how the variables are declared : this.element = element; this.$element = $(this.element); this.options = $.extend( {}, defaults, options) ; this._defaults = defaults; this._name = pluginName; this.init(); I taught in JS/jquery u had to declare a variable before you could access it with "this"
Combining animations into an array
Hi, I have 6 boxes with text inside that animate one by one. I was wondering how I can combine them into an array to condense the code. I would also like to animate the text in a similar way to the boxes to make it look more graceful. If anyone could help much appreciated! <script> $(document).ready(function() { $('.one').animate({ opacity: 1, height : "13em", width : "16em"}, '200'); }); $(document).ready(function()
How to create image map with jquery?
I have an image and there is a specific area in this image that I would like to link, not the whole image. I know how to do so with HTML, however I am interested in doing in with jquery. Does anyone knows how to do that? Any help will be welcomed. Thank you!
google geolocation not working in safari
Hi I have worked on a google map for some time but suddenly I get the error TypeError: Unable to delete property. in the consol and the system crashes when I use safari (but not the other browsers). I cannot see on which line it is but I have debug the error to happen when this code is generated: var mapOptions = { zoom: 12, center: new google.maps.LatLng(55.745254, 10.887451), mapTypeId: google.maps.MapTypeId.ROADMAP, streetViewControl: false, scaleControl: true }; try { map = new google.maps.Map(document.getElementById('map-canvas'),
timed delay
hey guys im trying to append html to a div but in delayed times creaded by the variable delay_time notification.delay(delayed_time).show("slow"); works with no delay change between appended html and notification.delay(delayed_time, function(){ // doesnt work notification.show("slow"); }); just doesnt work $(document).ready(function(){ $.ajax({ dataType: "json", url: "http://127.0.0.1/scripts/json.php", success:
Fixed menu problem with position when scrolling
I'm using this code for my fixed menu: $(document).ready(function () {
function my_function() {
var scroll_value = document.body.scrollTop;
if (scroll_value > 0) {
$("#my_div").fadeOut(500);
}
else {
$("#my_div").fadeIn(500);
}
if (scroll_value >= 650) {
$('#sl_userNav').show('slide', { direction: 'up' }, 750);
}
else {
$('#sl_userNav').hide('slide',
ajax json data
hey guys im trying to retrieve json data in my ajax request but for some reason it isnt alerting any message when trying to test. does anyone know what im doing wrong please...thank you guys $("document").ready(function(){ .ajax({ dataType: "json", url: "json.php", data: data, success: function(data) { alert(json['notification_message']); }, error:function(){ alert('error'); } }); });
Jquery filter and load more combination headache
Hi there, this is my very first post. I have registered because I am trying to implement a load more button to a list filtering plugin, it´s giving me a bit of a headache because obviously the filtering plugin controls the show and hide options of the list elements. Can you help me get this running? I am no good at javascript but I really need to get this working, this is why I ask you for your kind help. I thank you for your time in advance. The filtering plugin is called mixitup and I want to add
how to do a switch button in jquery ?
Hi, I am looking for a switch button that for example show ON or OFF, and when clicked I want to know the value is ON or OFF. Thanks, your help is appreciated.
data attribute always false
Hi, I have this fiddle : http://jsfiddle.net/mlotfi/nudh9hdv/ trying to use switchButton to get the boolean data from data attribute, in this example I have two , one true and one false : <div class="globalswitch" data-gswitch='true'> and <div class="globalswitch" data-gswitch='false'> but the result, the button is always false. Thanks.
position() returning undefined in wordpress but works perfect locally
I;ve built a content slider that works perfectly on my local computer but within wordpress it's stumbling on the following: var begin_position = jQuery("#individual_story_wrapper").position().top; I'm getting the follow error: : jQuery(...).position(...) is undefined Yet locally, the slideshow runs fine and I can see the position being changed as I animate the individual_story_wrapper up and down.
Next Page