JQuery :: UI Sortable Based On DIVs?

Aug 3, 2009

have such a structure in HTML which finally looks like shown on this

[Code]...

View 5 Replies


ADVERTISEMENT

Jquery :: Sortable DIVs Stored In Cookie But Cannot Be Moved

Apr 28, 2010

Having trouble getting with these sortable DIVs, they are stored in a cookie and loaded correctly. But after that they can not be moved any more.

PHP Code:
<div id="example-1-4">
<div id="containment">
<div class="column left first">
<ul class="sortable-list">
<li class="sortable-item" id="A">Sortable item A</li>
<li class="sortable-item" id="B">Sortable item B</li> .....

View 3 Replies View Related

JQuery :: Resizing Divs Based On Screen Size?

Aug 14, 2011

I am using the bookflip plugin i found here: [URL]

I am attempting to modify the code so the book pages resize based on the screen width... or height... not really sure how this should be done as I need the proportions of the pages to stay consistent.

I have been able to achieve the resize on page load but I now need to add the resize() method to the variable.

This is what I have so far (original code):

var $containerwidth = $(window).width();
var $pagewidth = $containerwidth/1.22;
var $pageheight = $containerwidth/2.05;

I think I need to add an if() statement in the variable that says if page width or height changes resize else original code that is working. I have this code which I know works but I can't seem to get to work with one variable without overriding the original code... which doesn't work with this application.

$(window).bind('resize', function(){
$(window).width()/1.22;
});

Is this the correct approach to achieve this. I have found I must work within the original JS file as overriding will not work.

if(..........? page resizes ?............){
$(window).bind('resize', function(){
$(window).width()/1.22;
});

[Code].....

View 17 Replies View Related

Sortable List / Data No Longer Sortable

Jul 9, 2007

My script is the same as this http://www.w3schools.com/php/php_ajax_database.asp

When the data comes back to me its using

document.getElementById("txtHint").innerHTML=xmlHttp.responseText

I get the data back fine. However inside getuser.php my data is in a sortable list. If i use this code above. My data comes back but I can no longer sort my list and move things around (I'm guessing because its returned as HTML only). Can anybody give me a solution of what i need to change so my list is also sortable again?

View 3 Replies View Related

JQuery :: Hide/show Divs Based On Form Parameters

Jun 13, 2009

I'm trying to selectively hide and show divs based on what a user specifies using three select boxes in a form. I'm probably missing something obvious, but here's what I've got and it doesn't, work, they divs just stay hidden.

<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">

[Code].....

View 2 Replies View Related

JQuery :: Synchronizing Vertical Scroll Of 2 Divs Based On When Waypoints Inside The Content Are Reached?

Nov 1, 2011

To synchronize the vertical scroll of the following "left" and "right" divs only when the beginning and end of each "blahN " div is reached inside the left div. Both divs have a finite height, which basically insures that the scroll bar will be present. The left div outputs text-based content from various database procedures while the right div outputs images corresponding to the text. The text is nothing more than pages from the website and as you can see inside the left div, each is encapsulated within a subsequent div with an incremental class (i.e.- "blah1", "blah2", and so forth.) When one scrolls through each "blah" content inside of the left div, I would like the right div to output the image that corresponds to the text (again, this data comes from the website through previous transactions.) Here's an example: John Doe comes to the website and starts reading the various pages listed inside the left div.

There might be 2 pages loaded inside the left div, or, there might be 20, but in any event, when he loads the entire page containing all this, the first page will be displayed along with the first pages' image. When he scrolls past this first entry (page) inside the left div, the corresponding image related to it inside the MySQL database is then output as well over in the right div and so on with every other "blahN " piece of content. Right now, the jQuery I'm using has synchronized both divs to scroll at the same time, regardless of specific waypoints that might be reached per-scrolling.

Here's the basic markup I'm using right now:

<div class="left">
<?php
foreach($obj->field_page_objs as $k1=>$v1){

[code]....

few other websites and the responsiveness has been minimal-to-nonexistent. I'm sure this is because of both how I've explained the problem combined with the overall difficulty (or niche-ness) it introduces. In any event, I apologize beforehand if this carries over into this website.

View 4 Replies View Related

Sorting Divs Based On ID?

Apr 15, 2010

I'm trying to sort these divs based on they're id after they've been outputted to the screen. How can I do this?

Code:
<div class="dateids" id="APR-13-2010"></div>
<div class="dateids" id="APR-13-2010"></div>
<div class="dateids" id="APR-14-2010"></div>[code].....

View 3 Replies View Related

Collect All Divs In Array Based On Regex?

Apr 8, 2010

I am trying to get all the div tags in my page into an array but only the tags with the ID "image**". Below is what I came up with but this doesn't seem to work, even after googling a bit I couldn't find any solution. I can't seem to come up with a solution.

function divs() {
var divs = document.getElementsByTagName('div');
var ImageTags = [];
for (i=0; document.getElementsByTagName('div').length; i++) {

[Code]....

View 2 Replies View Related

Hiding DIVs Based On Checkbox Selection?

Jun 11, 2010

I'm wanting to hide certain divs within a container. If the sub div DOESN'T have a checkbox which is selected in it, then it should be hidden when you click the link. eg: if #2 and #5 checbox only where selected then divs(sub_1,sub_3,sub_4) would be hidden when link was clicked.

[Code]...

View 11 Replies View Related

Show / Hide Content Of Sub Divs Based On Whether Input Is != / =

Aug 9, 2009

how can I show / hide the content of sub divs based on whether the input is != or = and be able to repeat this.I tried to hide the sub divs using , onclick if bla bla = '' ;document.getElementById('hideme').innerHTML = ''; which works, but once I try to enter a new input, then nothing happens, even if the content of the sub divs is = input.

View 2 Replies View Related

Show / Hide Divs Based On POST Value Sent From Another Page

Apr 26, 2011

The two page sections you see on the page "One Time Gift" or "Monthly Subscription" are normally hidden via a document.write via a body onload. Generally, all of this functions well. But, I want to expand the use a bit here so I want to pass a $_POST value to this page from another page which hides or shows these two sections based on this passed value. So, if the value in "once", I want the div with the id="onetime" to be visible and the other div to be hidden. If the value is "monthly", then the opposite would happen. Now this is supposed to all happen as the page loads because we are just arrivng here from the sending page.

View 9 Replies View Related

Show / Hide Divs Based On Radio Input

Mar 25, 2010

I'm having some issues with showing / hiding divs in a form based on radio button input. I'm fairly new to JavaScript so I'm still not 100% on what I'm doing... I have a pretty extensive form with quite a few container divs that are set initially to "display: none" and I need them to be set to "display:block" dependent on radio button input.

For this piece, I need the div with id "SFSCPROJSPONCOMP" to be displayed when the user selects the Radio button with name "PROJSPON" and value "COMP".If someone could provide me with JS code for that example, I can get through the rest of this form with ease.

View 2 Replies View Related

Show Hide Multiple Divs Based On One Div And Search Text?

Jun 14, 2011

I am going to achieve something like this.

<div id="sidebar">
<div id="html1"><h2>Test 1</h2></div>
<div id="html2"><h2>a1 tes2</h2></div>
<div id="html3"><h2>a2 tes3</h2></div>
</div>

The thing is that first I need to detect if the div id is "sidebar" if its "sidebar" then it will pickup all the text inside h2 tag and will search for a1 or a2 in the text.If a1 is found then it will pickup the id html2 and make this div only visible.So in this case it will pickup id html2 and make it visible while other ids like html1 and html3 will be hidden.

View 2 Replies View Related

JQuery :: Hover And Multiple Divs - All Hidden Divs Are Shown, Not Just The One That Supposed To?

Oct 14, 2010

I have been trying to do some tooltips for a website and desperately wanted to learn something new and do that with jQuery.However, every time a mouse hovers over a tooltip, all hidden divs are shown, not just the one that supposed to. Here's my html:

Code HTML4Strict:
<div class="tip">
<a href="#"></a>[code].....

View 2 Replies View Related

JQuery :: Show Two Separate Divs, Hide Divs On One Click?

Aug 19, 2009

I'm looking for some javascript to work with wordpress (jQuery preferrably) that will show/hide multiple divs on one click.

I had one working but it was kinda janky because it was causing me to have two divs with the same ID on one page. No good.

Since I updated to wp2.8.3 prior to launch, it's not working. So I've decided to just try and do it right.

Here's a page: [URL]

So, what I want to happen: On page load, the first tab: "general" and it's corresponding div beneath should be showing. And the first image should be showing. The other content divs and images should be hidden. I've given the text content divs a dashed border to show their borders. When a visitor clicks "dine at home" the general div and image hide, the second content div shows, as does the second image (it's currently the identical image, but the client may change later.) Etc.

I'll be using this function on a few other pages as well.

how to adjust this javascript to work on two different IDs at once?

current code:

Code:
<script type="text/javascript" charset="utf-8">
$(function () {
var tabContainers = $('div.imgswap > div');

[Code]....

View 2 Replies View Related

JQuery :: How To Use Sortable Tables

Jan 13, 2011

i am new to Html and i am helping run a website for virtual golf. we were thinking of adding a Statistics page but would need the table used to be sortable so by hitting the header the column sorts the figures in order, the tablw would only be 50 rows and 8 columns. i have looked at the website [URL]../docs/but cant seem to sort out where to place things. a step by step guide would very much be appriciated.

View 6 Replies View Related

JQuery :: Sortable Not Working In IE9?

Oct 21, 2011

Anyone had any luck getting sortable working correctly in IE9?

[URL]

I don't see anything in the bug tracker regarding this, anyone else experience this? Anyone have 5 seconds to fire up IE9 and try the above demo?

View 5 Replies View Related

JQuery :: Adding A Draggable To A Sortable

Mar 3, 2011

How to add a draggable to sortable programatically ?

<script>
$(function() {
$( "#sortable" ).sortable({
revert: true
});
});
[Code]....

In the above code i have a list of sortables, i want to add the draggable($obj) to a sortable, even though i add to the sortable in the add method, that gets added but does not play as a draggable,Do i need to call any method of sortable after adding the draggable ?

View 3 Replies View Related

JQuery :: Sortable Accordion-like Widget?

May 14, 2009

its an accordion like tool. It functions just how Ineed it, except id love to make it sortable.with the codeupdate?jQuery :

$(function() {
$("#accordion1").addClass("ui-accordion ui-widget ui-helper-reset")
.find("h3")

[code]....

View 1 Replies View Related

JQuery :: Get The Element That Received The Sortable?

Oct 19, 2009

I'm implementing a drag and drop newsletter, where my users can drag content to different areas of a template. Depending on where they drop the content, I need to add different HTML attributes to some of the code (essentially need to make the images float:left if they're dropped into a certain box). I've achieved a basic version of this using this code:

$('.review_list').sortable({
receive: function(event, ui) {
// somehow need to make this only apply to competition/
mainfeature

[Code].....

This adds align="left" vspace="4" hspace="4" onto any image dropped into an element with the 'review_list' class (I know I said it was float:left but this code will be emailed so I have to do it old school style...). Anyway: is there a way that I can get the element that has received the sortable item? It could be one of three in my case, and I only want this code to be added for two of them. I guess I could run a cleanup function when submitting that removed this addition for images in the other element, but this seems messier - I had assumed that the 'receive' event would return the receiving element.

View 1 Replies View Related

JQuery :: Sortable Inside An Accordion?

Sep 15, 2009

I'm trying to place a sortable list inside an accordion and it isn'tworkig. The list appears outside, below the accordion.

View 2 Replies View Related

JQuery :: Load A File And Use Sortable?

Apr 29, 2010

I'm working on a project and got stuck on this tiny script

I load some data from a file and I put in one div:

function getloadedfile (fileurl){
$.ajax({
url : fileurl,
dataType: "html",

[Code].....

The sortable only works then I don't load it as aseparatefile

View 4 Replies View Related

JQuery :: Applying Sortable To Images?

Nov 10, 2011

I've take the standard Demo code from 'm trying to make the images within the Trash container sortable.Despite attempts for the last couple if hours and a number of different combination, I'm still unable to get it working

View 2 Replies View Related

JQuery :: Sortable Get Its Embedded Fired Again?

May 11, 2010

<ul
id
=

[code]...

View 4 Replies View Related

JQuery :: Use Sortable For Multiple Columns?

Aug 9, 2010

In my design for admin panel, i wanna drag and drop modules. i have a php array with module names, and i need to save them sql like this[code]...

i can list right and left, but when i drag and drop something from one to another, it's not working.

is there any way to do that in jquery? can i get the information about where is the < li > ? how or where can i get the "where" columun?

View 2 Replies View Related

Jquery :: Copy Item In Sortable?

Jul 23, 2009

I have 2 sortable lists, #pieces and #grid. I want to drag items from #pieces and add them to #grid without removing them from #pieces. That way I could add any number of any item in #pieces to #grid. The current code i have is:

<script type="text/javascript">
$(function() {
$("#peices, #grid).sortable({
connectWith: '.column'

[Code]....

View 1 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved