Using jquery to display a specific array of images (from a filter category) in a light box
Hi, I have created an filterable image gallery using Mixitup. I have added a lightbox functionality to the thumbnails when clicked using foundation clearing-thumbs. The issue is that I don't know how to have the lightbox display the correct images depending what filter category is selected. At the moment it just scrolls through the 'All' filter. Here's the URL to the site: http://www.clairenolan.ie Could anyone help me with this? I’d greatly appreciate it as it’s pretty frustrating! Thanks
data:image displays image incorrectly on smaller screen
I got this snippet that loads 2 images with data:image. However, it only works correctly if the image is shown at 100%. But with a smartphone, images will be resized which results in an incorrect display. You can see for yourself (change ur browser window to a smaller size and select a color): fiddle.js So my question is: Is there a way to maybe a way to 're-load' the image that checks the window scale / viewport or such? And so, what the right way to do this?
Button name show on newly created row
Dear All Below is my code for dynamically add delete rows. i want to put the name of button on my first column what should i do to do this. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function () { function addRow() { var html = '<tr>'
first radio button "activ"
i have tried: jQuery( document ).ready(function() { jQuery('.product-field-type-S input').filter(':first').trigger('click'); }); ...in template/ js/cmsmart.min.js. it works not everywhere: Normal (work): Standardsortiment : Rosenstrauss in Rot iFrame (not work): http://blumen-gmuer.krt.ch/index.php...w=1&format=raw
overlay 2 images(+@ images) and wizard (PNG)
hi all friends i need make a wizard with PNG Images, something: 1) the start image is a door: http://postimg.org/image/nhz8cwmvl/ 2) the second images are: http://postimg.org/image/58nzxihxt/ or http://postimg.org/image/6lg4kcjip/ user choose 1, and too choose where is the image at front or back(of the Door, first image), 3) next step user choose: http://postimg.org/image/yzuf4zuc1/ or http://postimg.org/image/yc32pt3rl/ and tooo choose if was at the front or back... and so on.. i try: http://jsfiddle.net/pmy1nmuy/16/
DIV center is not workin
Dear All http://stackoverflow.com/questions/210717/using-jquery-to-center-a-div-on-the-screen I am using following code from above web page (function($){ $.fn.extend({ center: function () { return this.each(function() { var top = ($(window).height() - $(this).outerHeight()) / 2; var left = ($(window).width() - $(this).outerWidth()) / 2; $(this).css({position:'absolute', margin:0, top: (top > 0 ? top : 0)+'px', left: (left > 0
Adelani Adekunle - Is jQuery platform Independent?
Hello, I am Adelani Adekunle.I am learning jQuery now a days and just want to confirm whether it is platform independent or i need to install something for it.
Magnific Pop up not working for scroll images displayed using Java script (from Dynamic Drive)
Dear Sir Please refer http://prajaktasoftware.com/sugandhi/aboutus.php The click on scrolling image donot display the image in pop up however the same displayed (as non scrolling image) which indicates the Magnific popup is working displays the image in bigger size when clicked on scrolling image using magnific popup script for scroll image <script type="text/javascript"> /*********************************************** * Conveyor belt slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
changing a img src
hi i'm trying to change a images source with the following code: $('#photo').attr('src','IMG_0021.JPG'); can anyone tell me why i get an error msg: Untitled-1.htm:11 Uncaught ReferenceError: $ is not defined. thanks
How to Load a jQuery SweetModal Plugin
I was trying to override the old alert() messages: "You won!", "Computer wins!", and "Tied!" to a nice Sweetmodal plugin ( http://www.jqueryscript.net/demo/Beautiful-Animated-Modal-Window-Plugin-With-jQuery-SweetModal/ ) on a Tic-Tac-Toe game (the game is working good). Are those correct codes I did in javascript to make it work? HTML <html> <script src="action.js"></script> <style> /* UNIVERSAL STYLES */ .center { margin: auto; } body { background-color: #000000; } /* ELEMENT STYLES */ .button
Jquery button
Hi, I'm new to javascript and jquery and i want a button from jquery to run a script thats javascript when its clicked. Can someone help because im really confused Many Thanks Lucy
Overriding JS Alert() with a simple dialog box message
I built a tic tac toe game and it works OK, but Im trying to override Alert() by putting a basic dialog window divs in HTML (to display "You won!", "Computer wins!", and "Tied!") and JS calling IDs like this and it seems it doesnt work. I didnt want to mess up the javascript with the jQuery. HTML <!DOCTYPE html> <html> <script src="action.js"></script> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.10.2.js"></script>
Animation
So i've just started out with this and i'm kinda stuck .. I'm trying to animate a progress bar by taking the % value from the div attribute. So far i have animated it to my requirements with this simple code $(".progress-bar").animate({ width: "75%" }, 1000); This obviously works perfectly until i need multiple progress bars with different values, so what i want to do is use a script to obtain the ariavalue-now attribute value <div class="progress-bar" role="progressbar" aria-valuenow="65" aria-valuemin="0"
Content box in sortable list?
I am using jQuery draggable and sortable list for the first time and it seems the sortable list is working. However I have a question. When I try to drag the content box with custom CSS applied to the sortable list, the div goes into the list, but loses all the styles. Is this a normal behaviour? Is it possible to keep the styles when dragged into the sortable list? Here is the jsFiddle I put up: https://jsfiddle.net/3fa24d0p/ Thanks in advance.
Date picker Error
Hello all supporter, I have the problems related to the use of date picker. the below is my code: <script type="text/javascript" src="~/Scripts/jquery.ui.datepicker-fr.js"></script> <% ScriptManager.RegisterStartupScript(this, this.GetType(), "scripts", "onload();", true); %> <script language="javascript" type="text/javascript"> $(document).ready(function () { onload(); }); function onload() { //alert("MessageBox");
Getting checked value of element class
I have tried both of these, but neither works: var sex = $("input[name=sex]:checked").val(); var sex = $( ".sex option:checked" ).text(); <div style="display:inline;"> <input type="radio" id="male" class="radio sex" value="male" name="elements[]" checked="checked" /> <label for="male">Male</label> </div> <div style="display:inline;"> <input type="radio" id="female" class="radio sex" value="female" name="elements[]" /> <label for="female">Female</label>
jquery ajax
Hi, a question about $ajax Jquery function. Why if i passed 2 parameters to my php file that do an ordered query (select * from table where field1=param1 or field2=param2 Order by .... ASC) it just reply to me only records following first condition for example? Thx a lot
jQuery installation
Hi all, I found in Autocomplete in combobox mode, what I need for a piace of code. So I decided to use it. The question are: - Which is the best way to include libraries: online, local? And which files? - I used the combobox by downloading the "View code" part from demos, why it doesn't work with the complete package? I'm sorry but I don't know jQuery, because I do other for job.
increase height of treadmill so as to display complete unit
Dear Sir please http://prajaktasoftware.com/amogh/About-End2End-Financial treadmill works fine however the last div is not completely visible especially the bottom line Please help how do i increase the height by 2-3 pixels my css #mycontainer { max-width:710px; margin:2px auto;} .treadmill { /* main div in which smaller div with class "treadmill-unit" are embeded */ overflow: hidden; background-color:#; padding:0 5px; } .treadmill-unit { /* Smaller div embeded in main (teadmill) div
How to implement filter search result with JSONP result?
I have seen this done in many places and I like to implement this feature in my search result. I have a page that shows all the result of a search term(s). On the same page, there are two tabs (All and Refine) and the by default all the search results will be displayed in the All tab. Once the user clicked on this "Refine" tab, put check marks on a bunch of checkbox (search result's parent) that he's interested in narrowing down his search. He clicked the submit/filter button and the search results
How to retrieve data via JSONP with dynamic IDs?
Here's an example of how the API works from a third party provider. https://app.example.com/api/head/category.json?_authbykey=56a7d8c531231c4058361687&_fields[]=name&id[$in][]=56d0b73131231c210d494e3e&id[$in][]=570fa55491231c001d4aeb98&id[$in][]=570fa55f12331cdf3d804b86&id[$in][]=570fa56d32123ce53f804ab0 I gathered all my IDs into a variable "parentIDs" and below is my code thus far. $.getJSON('https://app.example.com/api/head/suggest.jsonp?', { _authbykey: "56a7d8c531231c4058361687",
lookup search
First, I don't know anything about jQuery but I'm looking for a solution to my problem and it sounds like jQuery might be the tool to fix it. I manage the content for a school website and at the beginning of each semester our student schedules change and on the first day we need a way to inform them of where to report for first period. I can get this information for each student in any format (text file, spreadsheet, etc) from our student information software, but I need a way to have the students
How to test if an array is defined, empty, or null?
I am retrieving JSON data via API from third party services. Below is my code: $.each(data.data, function(i, article) { var txtSum = article.summary.toString(); var txtTitle = article.name; var re = new RegExp('\\b(' + searchValue + ')\\b', 'gi'); txtSum = txtSum.replace(re, '<span>$1</span>'); txtTitle = txtTitle.replace(re, '<span>$1</span>'); output += '<h6>'; output += '<a href="../kb/article/'+ article.url_hash + '">' + txtTitle
using js with less elements
Hi, as i seen this page, i wanted to ask for help, today i've wanted to write a "randomize text code without the javascript display in the elements but i couldn't do it can someone tell me what i did wrong and correct me it? also this is an example i want to be same as this. https://api.rtainc.co/twitch/8ball and this is my code <html> <shadow><script type="text/javascript"> var textarray = [ "Hi, $(user)", "Welcome, $(user)", "how r u $(user)", "HYD $(user)" ]; function RndText() { var rannum=
JQuery Code executed BUT appears as text on the webpage as well
Hi, I just started out with JQuery and ran into some difficulties which I could not solve by myself. I used the bootbox plugin to create a dialog box if there is any error in the form input. The code works in the sense that the dialog box appears but at the same time the code snippet bootbox.alert("Hello world!"); is shown. I tried many things, amongst others the obvious of putting <script> tags around the code but code does not get executed. <form class='form-horizontal' method="POST" action="">
Ajax and Json
Hey I have a small Question about Json, I am trying to retrive some values following some little tutorial ive seen . and trying to add new stuff to it. so here it gos so my error is 100% in this function SummonerLeagues(summonerID) I am sure about this cuase when I remove it I get my response for the 1st half. but when I add it back i get nothing in return I am fairly new in this consept can someone help me udnerstnad what I am doing wrong ? <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
jQuery Slider returning/reading values on the Server
I have as ASP.NET application, it uses Bootstrap sliders, but the customer wants changes to the slider and changing the Bootstrap slider appears a nightmare, he has provided me with a sample jQuery slider that does what he wants BUT swapping the 2 sliders presents me with a server side problem - how do I initialise the jQuery slider with a database value, and on submit how do I read back any new value. Below is the server side C# code that works for Bootstrap's slider, but it uses an input HTML
Problem using Jquery and XMl to sort links by their number
Hello everyone, I've tried to sort links I've got in a XML file. I've using AJAX from jquery but I have problems. I wanted to create links order by their number into panels that can slide. Panels can slide but I'm a beginner using Jquery and Javascript and i don't know how I can do using AJAX to import my XML and sort it. But wait there's more ! In my XML I have a "commen" section that I wanted to show in "commentaire" section on my HTML every time mouse come over a link... I know it's a little bit
JQuery UI Tooltip with jQuery Steps, tooltips after validation
Hi, i use jQuery Steps for bulid form, jQuery UI tooltip for show validation errors, jQuery Validation Plugin for validate code bellow: css <style> .wizard > .content > .body input { width: 180px; display: inline-block; } .wizard > .content > .body label.error { display: none !important; background: #fbe3e4; border: 1px solid #fbc2c4; color: #8a1f11; } .wizard > .content > .body label { width: 150px; text-align:
can anyone help me why that code don't work
<!doctype> <html> <head> <script src="http://code.jquery.com/jquery-1.12.3.js"> </script> <script> $(document).ready(Function(){ $('answer').hide(); $('h2').toggle(function(){ $(this).next('.answer').fadeIn(); },function(){ $(this).next('answer').fadeOut(); }); }); </script> </head> <body> <h1> FAQ </h1> <h2> how many days are in one week? </h2> <p class=answer> i think seven </p> <h2> how many years are in one week? </h2> <p class=answer> oh boy a year is much larger than a week </p> </body> </html>
Images selected for upload PREVIEW only plugin?
Can someone recommend me a plugin (jquery, js, angular etc) that shows previews of images that are selected for upload? I dont want to upload them with this plugin, ONLY PREVIEW them. Images will be sent and uploaded normally with PHP. Also if possible if that plugin has deleting selected image option or reorder them, but not important. Best Regards
Passing dynamic variables back into HTML - Best Practices
Hi, what would be the best way to pass dynamic vars back into an HTML entity? I am tracking the mouse movement and passing with append() and it just makes a whole list when the mouse moves, I just want a current dynamic value to be presented; one line that changes dynamically. How should I approach this?
Animated sequence using uislider
ive just started learning jquery and im struggling. Im trying to create an offline page that incorporated a uislider that links a series of images (over 200) so when the slider is dragged it creates an animation, this will be a simulated construction build at a given camera view. I would like to have jquery check a local folder if possible and use all images in that folder as apposed to listing them individually. I would also like the position of the slider to be remembered between webpages and
Click to href issue
Dear Sir pls refer http://prajaktasoftware.com/sugandhi/project11.php?projectid=33 Pls scroll down to Configuration there are links <nav class="sdb_holder"> <div class="calltoaction opt1"> <ul> <li style="list-style:none;"><img src="images/pr5.png" width="36" height="31" align="absmiddle" /> <a href="projectfloorplan.php?projectid=1" style="padding-left:10px;">First Floor Plan</a></li> <li style="list-style:none;"><img src="images/pr5.png" width="36" height="31" align="absmiddle"
animate scroll not reason for not working in FF
is $('body , html') and $('body' , 'html') two different things ?? because the below code does't work: $('body' , 'html') .animate({ scrollTop: ($(section_id).offset().top - $('.main-nav').height()) }, { 'duration': 500 }); but the works: $('body , html') .animate({ scrollTop: ($(section_id).offset().top - $('.main-nav').height()) }, { 'duration': 500 });
Using jQuery to swap one WP Slider out for another
Hello!! Not sure where this post might live, i've decided to leave it in here in the hope that someone might suggest the correct home for it, or perhaps offer some advice on the question itself. I've got a wordpress build which uses salient (a theme) - this has a slider or image carousel built in to it as an element. I'd like to swap one slide in this slider out for another (which will play a video) on button click. So, a button click in slide 01 will essentially play a video. I'm reasonably certain
Cycle Titles with Flapper
Hi I'm really new to this and clueless. I'm trying to create a split-flap (Flapper) display which will cycle through anything from 5 to 10 titles - I got as far as 2 and that was what somebody else created on here. This is what I have so far... <div class="chained-splitflap"></div> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <script src="js/jquery/jquery.splitflap.js"></script> <script> (function ($) { $(document).ready(function () {
error message
i just typed my first jquery program like this. $(document).ready(function() { $('span.pq').each(function() { var quote = $(this).clone(); quote.removeClass('pq'); quote.addClass('pullquote'); $(this).before(quote); });//end each });//end ready in an html file that is attached to a jquery file, but unfortunately my browser provide an error massege like this. Untitled-2.htm:10 Uncaught ReferenceError: $ is not defined. can anybody here help me with that? thanks
Vertical Scroll in Reverse order
Dear Sir/Madam Find below link to view the script for vertical scroll http://www.prajaktasoftware.com/amogh/jQuery-Plugin-For-Infinite-Any-Content-Scroller-scrollForever/index.html I want this scroll in reverse order or suggest me another script for the same so that i can even change and reverse the order of scroll example http://www.prajaktasoftware.com/amogh/aboutus.php this scrolls the data in order I wamnt however being simple marquee,, it is not continuous. I am using following website for
how can I write a register jquery function to do the registration, and the login functions in two différent functions.
I have a laravel vue containing 3 forms, and I must do register or login in the page to pass to the next page. can you help me t write the onsumbit juery code function ? here is the view's code: @extends('layouts.layout') @section('chercher') @stop @section('apropos') <section> <div class="fea_block container-fluid" id="help"> <div class="fixed_w promka"> <div class="row"> <center> <h2> <font color="#00BFFF"> 4 étapes
Next Page