Forum Array

JQuery :: How To Move DIV And Resize It With Animation Effect

How can I both move a div and resize it with animation effect at JQuery? i.e. div will be at the middle of screen and it will go to the left side and will have %50 of its height and %50 of its width after it completed its move.(It will have for example %75 of its size at the middle of its way) I tried that: $(".block").animate({"left": "-=100px", "height": "-=30%", "width":"-=30%" }, 1000); However it disappears? This works: $(".block").animate({"left": "-=100px", "height": "30%", "width":"30%" }, 1000); However it makes my square more bigger, I try =-30% but doesn't work. What should I do getting smaller instead of getting bigger?

View Answers

Very Similar Questions

Resize Div Width On Window Resize
For a site I'm building now the logo has a centered font with two white lines coming off and extending to the edge of the window, regardless of the window size. I figured out that the easiest way to do it is to get javascript (through jquery) to resize the div whenever the document is loaded or the window is resized. My code looks like this: Everything works ... when the window is loaded or resized the bars line up with the logo perfectly. The problem I'm having is that when the window is resized by dragging the line sort of jumps around before settling down once the window size is set. Not a smooth resize, in other words.

Jquery :: Move Image Within A Div Tag?
I have a image inside a div which is 100*100 , i want to move the image inside the div like various company's does. for example [URL] does that.I tried the below code ,but it is pushing all other divs down ,the divs are getting expanded. $item.animate({height: '+=5', width: '+=5'}, 'fast', function() { $item.animate({height: '-=10', width: '-=10'}, 'fast', function() { $item.animate({height: '+=5', width: '+=5'}, 'fast', function() { [code]....

Move Div Contents On Mouseover Of Container Div?
I'm working on a concept of a movable map and was wondering if anyone could point me in the right direction or provide some examples of this already happening:I have a map that is contained in a div, the div is smaller than the full map. What I want to achieve is for the map to move when a person rolls over the container div. And of course be able to control where the map should stop moving by setting some type of boundary.Think Google Maps but by mouse movement and containment (without a user having to click to move the map).

Mouseover Effect - User To Move Their Mouse Over A Word And A Description Should Appear
I am wanting the user to move their mouse over a word and a description should appear. Like this: [URL], move your mouse over copyright symbol, which is down in the right hand corner of the photo. Could someone please tell how to do this? I know this would need JavaScript, but not sure what to search for in a search engine.

Jquery :: Library To Manipulate - Drag/resize/rotate - Objects
What's a good javascript library or jQuery plugin that allows you to move objects, resize them (preferably with at least 4 handles), rotate them, etc? [url] has some good things, but are there any other solutions out there?

Jquery :: Reposition And Resize Divs ?
I have a page with a header, footer, and middle area. The middle is 3 equal columns, each 33% width. When a column is clicked, I'd like for that column to climb above the 2 other columns and get a width of 100%, and the 2 columns to redistribute to 50-50. Is this sort of thing possible (and reliable) with jquery, or is it too much of a hassle? Can it be done with animations?

JQuery :: UI Resize 2 Divs By A Handle
I have 3 divs Now say my page is 800x600 So when the page loads #div1 and #div3 height = 390px and #div2 height = 20px; What i want is when #div2 is draged it resized #div1 and #div3 E.G So when that happens i want #div1 = 290px and #div3 = 490px And vice versa now this is the code i have for my site But this dose not work for me its never setting #dragBar top to 0px and not resizing any thing.

JQuery :: Resizing Width Depending On $(window).width?
I've recently start using Flexigrid (old JQuery grid plugin), and, as you may know, one of the few issue this really good grid plugin got is the lack of liquid layout option. My personal idea to solve the problem is to set the "width" parameter depending on $(window).width. Here is the problem (and here's why i post this question in "General use" and not in "Plugin"). The starting, and working, code is: $(document).ready(function(){ $("#flex1").flexigrid ( { [Code]..... This work fine for me, but I supose it could be done way much elegant... maybe somethin without "IF" that could emulate the "%", like var percentage = $(*0.XX with the 0.XX picked from an array of percentage, one for each column. Probably I should set up a function... ahhhh, as you may easily see I'm a total beginner with JQuery (and JS in general...)

Jquery :: Determine Browser Height & Width To Resize Image To Full Screen
I am trying to use jquery to get the browser height and width and than to use that information to resize my image to fit that dimensions. I want the images to be full screen on each page whether it is viewed on a lap top or a large monitor. I have all my images at a standard width of 1280 dpi now. To view what I have so far I have posted my code to my nyu account: [URL]

JQuery :: Scroll The Page To A Div If Div Dynamically Moves ?
Currently I am creating a website mainly using a mix of PHP, SQL, and JS. I use the JS to dynamically pull up new data using PHP and SQL. The current issue I am running into is that I have a button that when clicked will have the page scroll to the current DIV every 2.5 seconds based on offset. The issue is the function does not find the NEW offset once the element has moved. Code snippets: That is where the main issue is. It all works fine, though it only goes to the initial div's starting location.

Jquery :: Drag N Drop Mouse Over Effect?
I'm trying to emulate the behavior of this drag n drop found here How do I change the following code to get the mouse over effect with the rectangle outline? Also is it possible to have it sortable like the example above? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" ""> <html> <head> <style> .demo { width: 320px } ul { width: 200px; height: 150px; padding: 2em; margin: 10px; color: black; list-style: none; } [Code]...

Jquery :: Prevent Flashing Effect In Menu Animation?
I have a rolldown menu that has an undesirable flashing effect. At the top of the page I hide the menu to animate it later with a roll down effect. The problem is that the hiding isn't done fast enough. This causes all the roll down menus to flash before being hidden. What is the way to fix that? At the top of the HTML page I have this to hide the menus. code...

How To Make DIV With Glassy And Semi Transparent Effect
I want to give a div glassy reflection appearance as well as semi transparent effect. How to combine this two effects so that the div will look like a glassy transparent gadget. Is there a way to do this? (The div's bgcolor is lightskyblue and no background image is set yet).

JQuery :: How To Catch Exceptions And Display In Div
I was wondering what will be the method to catch any exception at server end and to show the error message in a div with error icon on top of the page using jquery. All the examples I have browsed show how to display the div on click of some button or link but in my case the scenerio is different. I want to use it for displaying messages to user and make use of Jquery's animations as well.

Jquery - Hiding A Div When Dropdown Selected Value Changes
I have a dropdown list that when the selected value changes I want to hide a div. (There is another control that makes the div visible). I currently have the following but the div is not hiding when I change the selected value in the dropdown. <script type="text/javascript"> $(document).ready(function () { $('#MyDd').change(function () { $('#buttonDiv').hide(); }); }); </script> <asp:DropDownList ID="MyDd" runat="server" /> <div id="buttonDiv" class="buttonContainer"> <asp:Button ID="myButton" runat="server" /> </div>

How To Use Jquery To Hide Div Tag
I have check box control and dropdownlist control inside div tag. I want to hid the div when I check the box and unhide it when I unchecked the box. I tried few ways with jquery but I could not do it. Here is my code look at it and tell me what is wrong with it. [code].....

JQuery :: Google Chrome - Animating Width Of A Div With An Absolute Parent
I am trying to animate the width of a div which is wrapped by a parent element that is positioned absolute to it's own parent. It is probably easier to explain by showing an example of what I mean. What should happen is that when the red rectangle is clicked the width of the green box is animated to a certain width whilst the red rectangle sits alongside it. This all works nice in IE & Firefox, but when running it in chrome the red rectangle jumps below the green box.

Dynamically Move /div Tag On Mouseover?
What I want is to have a page where part of the text is enclosed in a <div> tag with a particular attribute, like text color: <div style="color:#00FF00"> Lorem ipsum dolor sit amet,</div> consectetur adipisicing elit, When the user mouses over the next word in the text, in this case 'consectetur', the </div> tag would move one place to the right, so that the content now looks like this: <div style="color:#00FF00"> Lorem ipsum dolor sit amet, consectetur</div> adipisicing elit, Cannot figure out for the life of me how to do this.

JQuery :: Slidedown Submenu - Move My Mouse Down Too The Menu That Slides On Mouseover
<script type="text/javascript" The problem i have is when i try to move my mouse down too the menu that slides on mouseover. The moment i remove my mouse from the menu it moves away again(just like i made it). So my question is: can i make a div that pauses all script? That way i could do that with menycontent and force the menycontent to show.

JQuery :: Add Class To DIV If User Scroll Certain Amount Of Pixels
Is there a built in jQuery function to determine the length of a scroll? I'm trying to write a function that will add a class to a div if the user has scrolled 50 pixels from the top. So the code will look like this: if(userhasSscrolled) { $('myDiv').addClass('hasScrolled'); }

JQuery :: Items Move Up And Down?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> <html xmlns=""> [code]....

JQuery :: Css - Fade Out All Other Divs And Move $(this) To Top Left
I have a grid of div's (we'll call "#entry"'s). I currently have them where once someone clicks any one div it will make all the others fade out. However rather abruptly the selected(clicked on) div will move to the top left of the part div. How can I get it to "smoothly" transition to that part of the screen after all the others have faded out? I'll provide below the code I'm currently using. $(document).ready(function() { $("div#entry").click(function() { $(this) [Code].....

JQuery :: UI Slider To Move Multiple DIVs
I want to use jquery UI to have a slider on my page that moves multiple divs different distances. So basically you pull the slider and div1 moves 10px left and div2 moves 20px left. I have taken a look at the jquery UI slider here [URL] but I cant figure out how to get that slider to move multiple divs. I am pretty new to jquery but I am enjoying the learning experience.

Jquery :: Center DIV Contents To Viewport?
I'm trying to create a carousel similar to [URL], using jQuery and HTML. To do so, I need to be able to horizontally center the contents of a large (overflow-hidden) div to the viewport.

Move Image Inside A Div?
I have a div with a specific width and height. And a smaller image with the same width but much less height. How could I Position the small image to the inside top of the big div (but still all the small image to be visible in it) Animate the small image from the inside top of the big div to the inside bottom (and again, still keep it all visible) Inverse the process to go to the top again.

Move The Image To Half The Div?
I have this Page and as you can see if you scroll down below the map you will see the logo and header for "Barinos Market"...if you click on the read more link the text expands ..which is exactly what i want. The problem I am trying to resolve is when the user clicks read more I need the barinos market image on the left to scroll down with the text and be half way down the is the code... <div id="barino_info"> <div id="barino_header"></div> <div class="info_body"> [code].... I am using this plugin to do the is my jquery to do it $('.right_body_inner, .doughboy_right_body_inner, .haw_right_body_inner, .river_right_body_inner, .vib_right_body_inner, .barino_equipment, .dough_equipment, .river_equipment, .haw_equipment, .vib_equipment').expander({ slicePoint: 355, // default is 100 [code]....

Jquery :: Move Around An Image?
Using javascript, i would like to create an effect that displays a small image (1UP) that wanders around the "game deck" when users reach a specific level or score; user could gain an extra life simply clicking on it in time. Do you know any Jquery plugin or javascript snippet to achieve an effect like this?

JQuery :: Width() - N Div With Class="wrapper" - How Many Pixel Are All The Img
In my html there are N div with class="wrapper". In every wrapper there are img. I want to know how many pixel are all the img.i wrote this: var totalWidth = 0; But the console give me this error: Uncaught TypeError: Object [url] has no method 'width' In the rest of the file i use width several times and only when i add this metod the console give me this error.

JQuery :: How To Get Width Of Children Of DIV
I have a div containing many children all very different, each one as a different width. I need to get the width of all the children. I mean child1.width() + child2.width() + child3.width() etc... Of course as a new child can be added anytime I can not use the kind of things I put above. I tried that among other things : $("div.mydiv").children().width(); But I only get the width ofthe first child.

JQuery :: Html - Which Is The Better Approach To Autofit Children On Parent DIV Width
Based on the answers to another mine question (this: How to make children auto fit parent's width only with CSS?), I'm thinking which is the best jQuery approach to solve the problem regarding performance. Block 1: find all DOM elements when needed: $("div.parent a").css("width", $("div.parent").width() / $("div.parent a").length - 2); Block 2: find only DOM children, use each(), parent() and siblings(): $("div.parent a").each(function() { $(this).css("width", $(this).parent().width() / $(this).siblings().length - 2); }); Block 3: find DOM parent first, use each() and find children based on context: $("div.parent").each(function() { $("a", this).css("width", $(this).width() / $("a", this).length - 2); }); Here is the Fiddle if someone wants to test: [URL] So, which block is better? And why?

JQuery :: How To Check If Two Elements / DIV Belong To Same Parent
I am working on this piece of code for a shopping cart $('.addtoCart').click(function() { //get button id var cartID = $(this).attr("id"); //get check box id var checkBoxID = $('input.cartLevelChecked:checked').attr("id"); //get parent id var levelListID = $(this).closest('li').attr("id"); if(('#'+cartID && '#'+checkBoxID).parent('#'+levelListID)){ $(".selectPlan").show(); } //alert(/*cartID + checkBoxID +*/ levelListID); }); Basically I'm checking to see if the check-box the user checked and button they clicked on belongs to the same parent then show a div.

JQuery :: Fade Edges Of Div?
How can I fade edges of a div with jQuery? Think of a carousel with images inside that slides horizontally. How can I fade out the left and right sides so that images near the edges disappears gradually.

JQuery :: How To Move / Drag Items Between Two DIVs Or Selectboxes
I want to know how to move the list items or selectbox items between the divs or selectboxes. I am unable to how to know to use the jquery plugins and how to implement. If I download one plugin how to make it use in my application...

Jquery :: Cover Div With Semi-transparent Image?
I want to cover a <div> so it looks like it has a semi-transparent block over it.I am using jQuery but I do not know how to do it.

JQuery :: Drag-and-drop DIV Selection With Images And Text
I'm using the jQuery tableDnD plugin to make a drag-and-drop list out of a table displaying a list of images for the user to rearrange. The plugin uses an ID on the tag of the formatting table to rearrange the cells. When I drag and drop specifically clicking on a spot inside the table cell with no images/content, it works fine. However, when I click on the image (or inside a div containing text) withgin the table cell and try to drag+drop, the text/image gets selected and the rearrange script is not triggered. Neither blocking the select function with css or javascript has worked - [Code]...

Jquery :: Droppable Center Image In Div After Drop Event
i'm creating a simple inventory using jQuery droppable. For now, it's like : $(document).ready(function() { $( ".weapon, .helmet" ).draggable({ revert: "invalid", cursor: "move" }); $( "#weapon_spot" ).droppable({accept: ".weapon"}); $( "#helmet_spot" ).droppable({accept: ".helmet"}); [Code]..... when i drop an image to another div, it's not aligned in the center of the div, it's not locked and it can be moved inside it. It seems that i can use Drag. EDIT : I have created a demo at [URL]

JQuery :: Async JQuery Treeview + Partial Rendering?
i have an Async JQuery Treeview working, but in addition to filling out the tree - id like for every node expanded to update part of the page with information as well - is this possible?My View looks like this: [Code].... And my Controller looks like this: [Code]....

JQuery :: How To Download Attachment Using JQuery Ajax
I am using JQuery in my application. I am having a div in my page which will get fill with another page content on a button click. The following is the code. $("#dialog").load('Default.aspx?TicketID=15'); Now i am having a button in this Deafult.aspx page which will download an attahchment from the database. If i write a server side event to download  the page is getting postback and the content in the div has gone. So, i have used JQuery Ajax method to download the attachment. But i the attachment is not getting downloaded. $.ajax({ type: "POST", url: '../Forms/frmUpdateProblemTicketStatus.aspx', data: 'AttachmentID='+AttachmentID, dataType: 'JSON', success: goodSubmit, error: failedSubmit }); I am not able to download this.

JQuery :: Dynamically Resize An Image Based On Width Of It's Parent DIV?
I have a DIV tag that will be 500px in width. Content is coming via an RSS feed that includes images. Some of these images are wider then 500px which destroys the layout. Is it possible to use a bit of jQuery to resize images on the fly if they exceed 500px in width and keep the ratio proportionate?

Linq To Jquery With Jquery Ver Jquery-1.7.2?
this is my class: Public Class Employeeclass Public Property Fname As String Public Property Lname As String Public Property Bdate As Date End Class [Code]...

JQuery :: Hide The <div> On Mouseleave Of The Same <div>?
i need a solution to hide the <div> on mouseleave of the same <div>.i have achieve this on IE but on other browser this is not working my code is function divonmouseout()

Jquery :: Adjusting Width Of A Main Div After Hide/show Of Another Div?
I have a main div which contains two divs. One for main content and one for sidebar content. Sidebar content is hidden/shown on clicking one link. So when the sidebar is hidden, I want the content div to occupy the whole space as the container div. But when sidebar content is shown, it should give some space to sidebar on left and adjust itself. Here is the code. Right now i am implementing using jquery.

Catch Event That When Left Click And Then Move Some Where (not Drag Some Div ) On A Div?
this is my code: $('#handle').mousedown(function(e){ if( (!$.browser.msie && e.button == 0) || ($.browser.msie && e.button == 1) ) { alert("Left Button"); } }) this event is like to drag , but not drag, the left button Has been pressed, no released until mouseup, so how to catch it using jquery, this is my demo : [URL]

Jquery :: Drag And Drop - Update Table Content While Dragging The Element
my question is can we update the table content while dragging/resizing the div.The content is the position and size of the div that is dragged or re-sized

C# - Turning HTML Div Code Into A Control?
I have bunch of HTML code I am using to make rounded edge boxes on my controls. Is there a way to take this code and turn it into some kind of control or something so I do not have to keep pasting 10 lines of HTML code around everything I do? <div id="BottomBody"> <div class="box1024" > <div class="content1024">[code].... One additional thing to note, the number HTML tags used inside the inner most DIV will change depending on where I use it in my site. So in some cases I will only have 1 tag and 1 tag but in other cases I could have 1 tag, 1 tag, 3 tags, and a HTML table. How can I make that work?

Jquery :: Prevent Page Scrolling When Scrolling A DIV Element?
I have reviewed and tested the various functions for preventing the body ability to scroll whilst inside a div and have combined a function that should work. code... This is stopping all scrolling where as I want scrolling to still be possible inside the container This is also not deactivating on mouse leave Any ideas, or better ways of doing this?

JQuery :: Prevent .load Scrolling Back To Top Of Page When Loading New Content Into Div?
I've gotten .load to load content into a div but if the window is not at the top of the page it scrolls back to the top each time the new content is loaded but I wanted to avoid any sort of change on the page other than the content in the div. It seems pointless if the user has to scroll back down to the div where the content is each time? code... Is there a way to keep the window in the same position? Also while I'm at it - is there a more efficient way to write this considering I have 9 pages or should I just write this code out for each instance?

Prevent Window For Scrolling After Div Box Scrolling?
I have a small div box that has a vertical scroll bar and sits within an html page that also has a vertical scroll bar. My problem is when the user reaches the end of the small DIV box scrolling, the ENTIRE html page that contains the div box then begins to scroll (assuming the user is scrolling via the mouse scroll and NOT by actually clicking the DIV box scroll buttons themselves) is there a way to prevent the entire html page from scrolling once a user reaches in end of my small DIV box scroll? I have tried this (but it cancels scrolling for even the div box): if (window.addEventListener) /** DOMMouseScroll is for mozilla. */ window.addEventListener('DOMMouseScroll', handleWheelEvent, false); /** IE/Opera. */ window.onmousewheel = document.onmousewheel = handleWheelEvent; function handleWheelEvent(e){ e.preventDefault(); }

Calling Pushing Effect Of Command Buttons Through Code
i have a command button also a label control on a form . now i want ( as i click at label contol command button giving me a pushing effect ) as it did when we click at command button .

Capture Min Button Click, NOT RESIZE EVENT
hey,I know tons of people have asked how to capture the minimize button click event, and the only answer Ive seen is using "form resize" event with windowstate = vbminimized, but is there another way? Im using sysApp to work on a "minimize to tray" option in my application, using the minimize button on the form. If the form resize event shows "minimized", then it points to the "minimize to tray" routine. However,,, too many events cause a "form resize" and throw the app into unecessary looping, back and forth between the "resize" routine, and the "minimize" routine. For example, the following 2 lines are from the sysApp "minimize to tray" routine. Each one resizes the form and restarts the loop, exiting the "minimize" routine, and going back to the "resize" routine, thus sending it back to the "minimize" routine....etc,etc,etc.....Me.visible = true Me.windowstate = vbnormalit eventually works, but its really "clunky" and takes a while (relatively speaking) to finish looping and finally either minimize or maximize out of the tray. Isnt there a way to use the shell or something? An API???

Android :: Disable Orange Circle Effect When Clicking On A Link In A WebView
I'm trying to catch the mouse click location so I wrote an onClick in the body tag, but every time I click on the page the whole page turn orange for a little while. Is there any setting can disable this effet?

Controlling Outside Applications - Resize Multiple Applications And Send Keystrokes To Each One
I am working on a project that is used for key broadcasting. Don't worry nothing illegal, I'm making a multibox application for world of warcraft. However I am having trouble when it comes to launching and manipulating other applications from another. [Code]...

Calendar_selectionchanged Event To Raise Div Region?
In my calandar_selectionchanged event .. am showing a div region in my page on the top of the calendar. Like [URL] on clicking Login You will find a small page opens similarly which i want Sameway, i want to open a div region on below to the selected can it be made .. am using vs2005 code ajax. This is the div region should open on every calendar_selectionchanged event... <div id="daydetail" runat="server" visible="false"> <h2>Details for <span id="selectedday" runat="server" /></h2> <span id="daydetail_render" runat="server" /> <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" Text="Button" /> </div> Public Sub Calendar1_SelectionChanged(ByVal sender As Object, ByVal e As EventArgs) myCommand = New SqlCommand("Date1", myConnection) myCommand.CommandType = CommandType.StoredProcedure Dim parameter_Date As New SqlParameter("@_Date", SqlDbType.DateTime, 8) parameter_Date.Value = Calendar1.SelectedDate myCommand.Parameters.Add(parameter_Date) myConnection.Open() myDataReader = myCommand.ExecuteReader() Dim temp As String = "" While (myDataReader.Read()) temp &= "Title : <a href=""somepage.aspx?ID=" & myDataReader.Item("id") & """>" & myDataReader.Item("Country") & "</a><br><br>Email : " & myDataReader.Item("State") & "<br>"     ' This Is the div region which ll be displayed   End While daydetail.Visible = True daydetail_render.InnerHtml = temp.............................

Forms Data Controls :: Resize The Gridview Columns?
I m creating my application in ASP.NET 2005 with C# and SQL SERVER 2005. In standard control i have used the multiline textbox in my application and on the click event the date displays in gridview. I have used the textbox for storing the address which contains the atleast 3-4 lines... <asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1" autogeneratecolumns="false" AutoGenerateDeleteButton="false" AutoGenerateEditButton="false" DataKeyNames=id> <Columns> <asp:CommandField ShowDeleteButton="True" ShowEditButton="True" /> <asp:boundfield datafield="id" readonly="True" headertext="ID"/> <asp:boundfield datafield="address" headertext="Address"/> </Columns> </asp:GridView> I think the columns of the gridview are not resizable.They are predefined for each column... Now,what i want it to look or display should be as :: ADDRESS Name of apt,soc Opp or near by Area name I want to display the text in the gridview in the same way as above. The values are stored in the database and i get them thru sqldatasource...

Javascript - Multi-line Title In Div Tag?
I'd like to have the following div tag display a tool-tip on mouse hover. But, it displays it as a single line. How can I get it to display several lines? <div title="Have a nice<br />day">blah</div>

Web Forms :: Div Tag Scrolling In Firefox?
Div tag scrolling working fine in IE but not working in firefox. [Code]....

Forms Data Controls :: Scrolling Of Div With Javascript?
I'm trying to control the scrolling of a div containing a gridview using some js code I found at [URL] Intent is to stop the gridview in the div from scrolling to the top after the select in the gridview is operated. Prior to adding the ajax extentions the detail would display when the select image was operated.  Now the grid appears ok but when the select is operated nothing happens - perhaps the nSelectedIndexChanging="DetailsView1_Show" code behind is no longer firing?  Perhaps I am missusing the ajax extentions? Using VS 2010. My code is as below, <asp:ScriptManager ID="ScriptManager1" runat="server"/> <script type="text/javascript"> var xPos, yPos; var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_beginRequest(BeginRequestHandler); prm.add_endRequest(EndRequestHandler); function BeginRequestHandler(sender, args) { xPos = $get('serviceorders').scrollLeft; yPos = $get('serviceorders').scrollTop; } function EndRequestHandler(sender, args) { $get('serviceorders').scrollLeft = xPos; $get('serviceorders').scrollTop = yPos; } </script> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <input type="hidden" id="hdnScrollTop" runat="server" value="0" /> <div id="serviceorders" style="position: absolute; left:300px; top:180px; height:100px; width:700px; font-family: Arial; font-size: small; color:black; overflow:auto">            <asp:GridView ID="sobydate2GridView1" runat="server" AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="SOSONO" DataSourceID="sobydate2gridview1SqlDataSource" AllowPaging="false"  HeaderStyle-Wrap="True" GridLines="None" OnSelectedIndexChanged="DetailsView1_Show" OnSelectedIndexChanging="DetailsView1_Show"> <Columns> <asp:CommandField ShowSelectButton="True" ButtonType="Image" SelectImageUrl="linkimage.gif"  /> <asp:BoundField DataField="SOSONO" HeaderText="Service Order" ReadOnly="True" <asp:BoundField DataField="SORSP" HeaderText="RSP" SortExpression="SORSP" />

Way To Set My Returning Function String To Be Displayed In Div With Scroll Bar
i have made a simple chat class but for displaying the msg i use a textbox but by ajax and page post back the scroll bar moves up and its very unprofessional so i need a way to set my returning function string to be displayed in div with scroll bar

AJAX :: Dynamic Div Display Position When Use It Inside ModalPopupExtender
n one of my page. Inside the popup, when user click on a button say "Show Details", i want to display a div in which details text will be shown.  On client click of Show Details button, i retrive Show Details button's left and top position from java script and set details div's display = block. This works fine in a normal page and detail div shown exactly at the position of link button, but when i use this inside a ModalPopupExtender(see below code, i have put link button inside the  ModalPopupExtender's panel), the detail div not displayed at the postion of link button. Instead, it shows at some other position out of the popup. How can i display the detail div inside the popup and at exact position of the link button?  See the code below. [code]....

Web Forms :: Set Of Images Cannot Get Centered In DIV
Set of images I am using can't be centered in the div and I need to center them but cannot. I just changed the code a moment ago to work without the div's only the mainContainer div located in the master page the new code is has follows: [Code].... All the code is inside a asp:Content control that is used to connect with the main container that itself is a div.

C# - Importing Name Space Without Use Effect Performance?
Is there any deficiency performance if import a lot of name space in Web.config or in every single cs file while it's not necessary to be in all classes ?

How To Hide And Show Div's On Button Click In A UpdatePanel
I am using UpdatePanel ---> LinkButton --> Div --->Table Structure. When I click the Linkbutton the div has to show the table format first and has to execute the code in its OnClick event, the problem I am facing is I've tried so many jquery functions shown below: <asp:LinkButton ID="lnkbtnUnitAdd" runat="server" OnClientClick="Toggledivs()" OnClick="lnkbtnAdd_Click" Text="Add" ></asp:LinkButton

Passing Html Div Classes In Mail Form?
I have the following code in my php mail form: Code:[Select]print '<div class="email-err"><h3>Error!</h3><p>Please enter a valid email address</p></div>'; } elseif (empty($emailName)) { [code]...     Is that the proper way to pass divs and classes through php?I am trying to target them with css and nothing is working, so I'm guessing it is not.

Curl And Resize Remote Image?
I use this script to download and resize a remote image. In the resize part something goes wrong. What is it? <?php $img[]=''; $img[]=''; foreach($img as $i){ save_image($i); if(getimagesize(basename($i))){ [Code]...

Jquery :: Absolute Positioning An Element Inside A Fixed Positioned Div IE Not Working?
I am developing a WP theme and for it I am offering users the possibility to choose between a fixed header or a fluid one.The problem comes when the user selects the fixed one under IE where the dropdown menu is not showing at all.

Create Absolute, And Then Fixed Div?
I just thought this might require some javascript, so I posted this here. Anyway, how do I create an element that is absolutely positioned first, and then, when it goes to the top of the page, it becomes fixed?

Variable Scope And Crossing Functions - Resize Plugin In Order To Obtain The Varying Computed Width Of...
I am using Ben Alman's JQuery resize plugin in order to obtain the varying computed width of an element when the window is resized (the element in question is a page wrapper that exhibits the expand-to-fit behavior of a block box, and it's computed width is obviously influenced by the resizing of the window. Essentially, what I need to be able to do, is to reference a variable that is defined in a .resize() function ('width_page') in a seperate .each() function. [Code]... I now understand that variables can't cross boundaries like in the example above, which leaves me a little stuck. I also understand that this is specific to the context of the .resize() function, and that it can't be taken out of it without using an element selector. Is there some way I can call the .resize() function in my .each() function?

Possible To Resize Text To Fit A Fixed Size Div?
This seems like a pretty natural use case to me, though I haven't been able to find anything on it:Say I have a fixed-width div that is dynamically populated with some number. What's the best way to ensure that numbers with more digits take smaller font sizes such that they fit nicely into that fixed width? Is there some CSS property for this, or do I have to resort to Javascript hackage?

Jquery :: Move Flash Animation In-page To A Popup Without Reinitializing?
I have a Flash video which sits in a small box on the side of my website and plays video. When the user clicks on a 'View larger' button I need it to display in a lightbox - but continue playing from the same place. A simple piece of jquery like this works fine to move the video to another DIV (such as a jquery UI popup window). $('.holder', dialog).append($("#DemoVideo")[0]); However in Chrome + FF it restarts the video from the beginning - basically it reinitializes the <object>. My solutions are either : Position it absolutely with CSS in the first place and move it to the popup with CSS and some nasty JS event resize handlers Remember the position and just instantiate a new video player and make the user live with the delay of rebuffering Hopefully there's some other clever way to move an <object> tag?? Note: this is the jwplayer - but applies to any Flash object

Jquery :: Animate An Image To Move Away From Cursor Position On Each Mouseover?
I'm trying to animate an image of a box by changing it's position on mouseover. I can get it to move once but I need to set it up so that it moves everytime someone mouses over the image. I want to make the users 'chase' the box around the screen. Preferably the animation would loop so that a user can never catch the image ?[code]...

Change Width & Height Dynamically Of Div?
This script changes the image, I wanted to know if there is a way to automatically resize the div's height and width based on the actual image proportions. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> <html xmlns=""> <head> [Code]....

Display DIV Only If User Has Been Idle For X Amount Of Time
I would like to display a helpful DIV that basically shows the user how to accomplish something on a particular page, but only if the user has been idle for a period of time, say, 30seconds. What I mean by "Idle" is: Not clicking any links Not right clicking anywhere Exceptions: I would like to exclude the following conditions from the Is User Idle rule: User has scrolled up or down/left or right User has pressed mouse button on an empty area on the site/ or on an element which has no source/link for example, an image with no hyperlink. and, Pressing keyboard buttons Can this be done? Or can we only detect when a particullar event occurs?

JQuery :: - Using To Move Items Between .NET Listboxes?
I have two listboxes, two html input tags and one .NET submit button on an webpage. // The two listboxes <asp:ListBox ID="lbViewOptions_Hidden" runat="server" Rows="7" Width="110px"></asp:ListBox> <asp:ListBox ID="lbViewOptions_Show" runat="server" Rows="7" Width="110px"></asp:ListBox> // The two html input tag <input id="ibtnRight" type="image" src="images/move_right.png" style="height:16px;width:16px;border-width:0px;" /> [Code]... The listboxes are loaded during the page_load event with various items that are dynamic, thus my reason for using ASP.NET listbox controls instead of just hardcoding an HTML select tag with the various items. My problem is this: due to the fact that the listboxes are .NET controls and I'm using jQuery to move items back and forth between the them, any changes made to them does not persist through a postback. For example, assume that listbox lbViewOptions_Hidden has two items in it: "Foo #1" and "Foo #2". If I select item "Foo #2" and click the input button to move it to listbox lbViewOptions_Show, then it moves over as it should, and I now have item "Foo #1" in the first listbox and item "Foo #2" in the second listbox. However, if I click on the .NET button btnApplyViewOptions to submit back to the server, the second listbox has no items and all of the items are still in the first listbox. How do I go about fixing this problem? I assume that it has something to do with the ViewState, but I'm not positive about it.

Animated X Library Resize
I'm using the function 'xResizeTo()' found in the X Javascript Library. I'd just like to have it animated to the specified new size. I would like to have something similar to the effect wich you can see in the above menu bar where it reads 'Quick Links' in sitepoint forums. At the right side of the search textarea.

Serialization - Side Effects Of Serialize As Hash Function?
I'm looking to create a sort of HashMap class in PHP. For the sake of being able to build upon PHP's associative array functionality, I have a hash function, which should be able to take any variable (primitive or object) and turn it into a string for use as an array key. For this hash function, I am thinking of using serialize(), but I noticed that PHP calls __sleep() on an object when that function is called. I'm assuming this could be problematic. Am I right? If so, what can I use to get a hash of either a primitive data type or of an object? I did look at spl_object_hash(), but its results seem less than unique, as it uses reference locations, which appear to be reused? Update: If anyone's interested, this is (roughly speaking) what I ended up with. The Collection interface can be ignored. Any improvements welcome, of course. Oh, and there isn't a remove method yet. <?php include_once 'Collection.php'; class HashMap implements Collection { private $data; private $hashes; [Code]...

Jquery :: Set The Width Of A Parent Div Dynamically Based On The Width Of A Ul?
I've got a subnav on my site which is horizontal and I need to center it in the layout. Every subnav has a differnt number of elements so I need to calculate the width of the UL and then add it to the wrapping div so it will center properly.Here is my html <div id="subNav"> <ul id="navsub_761243_795431"> <li><a href="/Asset/RIA">Why Choose a RIA</a></li> [code]....

JQuery :: Move A Set Of Divs Into Their Parent Elements?
I'm trying to move a set of divs into their parent elements. Currently I'm using: [Code]...

Jquery - Reflect The Increase Of Width To A Div Dynamically To Opposite Direction,after Width Reaches...
ok ,i dynamically increase the width of an empty div with css property of opacity 0.5,when the mouse is dragged to the right side.i also want to increase the width of the same div element when it is dragged to the left side(i.e) the width reaches below zero,i can absolute the value of width but i want the ui to be increasing in the same direction as well? #thing { position: absolute; border: 2px dashed #000;[code].... when x value is less than oldx value that is the mouse drag is performed to the left side ,i want the ui change(change in width and height) to be reflected to the left side.

Width Of Div Changes When Position Becomes Fixed From Relative
The width of the div "topNav" changes by few pixels when its position style is changed from relative to fixed. I found a jquery plugin [URL] which can perform the same functionality I'm looking for elegantly, but I feel it is a overkill for this purpose. EDIT: My question is how to avoid changing the div sizes. Check out the code at : [URL]

Creating Div With Fixed Width And Flexible?
I'm trying to create a div which will have fixed width and flexible height , here is the picture which I want to use for background. The thing is when I have div larger than image height the bottom rounded corners are omitted and also if I have div less than the size of image same thing, how do I make this work with round corners with all sizes

Set Child Element Width To Parent Div?
I'm having a parent div and inside that child element will be table. i'm hiding some columns in the table thro' css becoz to avoid inline-style. so how can i reflect the width to parent div after hidding the column of table...

Set The Width Of A Div To Be The Same Width Of The Image Inside The Div
I want to set the width of a div to be the same width of the image inside the div.The following code works great. But...The images are different widths, so both wrappers are set to the width of the first image. Without having to add an ID to each wrapper or image, can the wrapper width be set to the image width using the name of the image as the unique identifier? jQuery: $(document).ready(function(){ var newWidth = $('div.wrapper img').attr('width'); $('div.wrapper').width(newWidth); }); HTML: <div class="wrapper"> <p><img src="image1.jpg" width="200" /><br /> Caption</p> </div> [code].....

Can't Get A Div's Width Using
I'm starting to write a little exercise for myself where I am going to have some divs that I can drag on the rightborder to increase or decrease the Div width. I also have a container Div that has a set width and I'm going to use this to determine a percentage - basically I'm going to be making some kind of bar-chart / histogram that you can edit. I'm started writing my code and I thought I'd just make sure I could output the percentage. Here's the perliminary code.... <style> #container{width:500px;} #dragDiv{border:1px solid #000;background-color:pink;width:100px;height:100px;} </style> [Code]... and low and behold I was now getting a value for the item! Now I don't like inline styles (who does) however I've never had this problem before and I've been using JavaScript and HTML for years - has anyone got an explaination for this? To retrieve the width not set by CSS do I have to use a different property like clientWidth?

Canvas - Resizing Picture According To Height / Width Of Window
[URL] My goal is to make the picture fit inside the window with the width of the image being the same as the window, even after resize. If the pictures height becomes to big for the window then the picture should resize itself according to the height and not the width. Somewhere along my code there is something wrong.

Jquery :: Set DIV Height Dynamically Based On Viewport Height?
I'm trying to set a div's height to 30% of the viewport height and I would very much like to scale it when the height of the viewport changes.I tried setting min-height: 30%; height:30% but it is not working.I took a look at JQuery's height(); but I just don't know how to get started.

Centering Div On Page - Get The Height And Width Of The Div Element?
I have the following DIV, that I need to position in the center of the page, I have the following code, but you can see the div is not exactly center, space I have from the top is not the same I have in the bottom, the space I have from bot side is the same.I was wandering also if I can do this dynamically, meaning the div will receive the width and height in run time, and them I will send the values to my method "centerObj" (How I can get the height and width of the div element. <html> <head> <script>[code]....

Resizing Height & Width In Percentage Not Pixel?
I am using jQuery plugin for resizing the elements. Elements height & width is set in percentage (%) not in pixel. Whenever i re-size any element it's height & width changes to pixels which is fixed but i wanted this change in percentage.I am sure there must be some technical issue for this but there would be solution too. #parentDiv { height:100%; width:100%;} .image { height: 25%; width: 25%; } <body> [code]....

Jquery :: Find Width Of Left Floated List And Apply To Wrapper Div To Center It Using Css
I wish to center a ul in a div that is the left column of a liquid layout. To do so I need to set the width of a div that I've used to wrap the ul. Note: the list items (and content) are retrieved from a database using php.I'm interested in your suggestions on how to do this using jquery.

Using Exif Thumbnail() To Resize
Wanting to use the function exif_thumbnail() to resize a thumnail on my screen. I can get the thumbnail to display okay, but it doesnt resize in accordence with the paramters ive passed it. using exif_thumbnail() to resize ....

JQuery :: All Images Must Be Resized If Width Exceeds Max Width?
I currently have a website where i share thoughts with my friends (some kind of forum) and within this 'forum' people can post pictures they made but most of the time these pictures exceed the max width of my website so my website gets all streched out!So this is what i want: all images on the page must run thru some sort of function which checks if the image image width exceeds the max_width. if it does then the script must calculate how many pixels the current width exceeds the max_width and get this number so that the script does: current_width = current_width - (max_width - current_width)

JQuery :: Html - Set Div Width To Sum Of It's Children?
I have following setup: html: <div id="holder"> <div> <img/> [Code].... now, i want to make jQuery gallery and will move line of images to the left and right with negative margin-left of inner div. However, I have to tell <img/>s to float to left and set inner div's width to sum of widths of images.

JQuery :: Using .animate() To Animate A Div From Left To Right, Right To Left?
I seem to be having difficulties using jQuery .animate() to animate an absolutely positioned div from right to left on a button click, and left to right on another button click. Below is my relevant CSS, HTML, and jQuery code. I can click the #moveLeft button and it wil indeed animate it to the left, but when I click the #moveRight button, nothing happens. CSS #scorecardTwo { position:absolute; padding:5px; [code]....

JQuery :: Onclick Slide An Element To Left Then Show A Nested Hidden Div?
I have a vertical navigation menu with the basics (a <ul> with four <li>) but I need one of these list elements to slide to the left and when it finishes show or slide down a nested <ul> with its own li that is now hidden with display: none. and when I click again the first list element I wish everything to close back. or alternatively to close with a timeout. so far I got to this: $(document).ready(function(){ $("#gioca").click(function(){ $("#gioca").animate({ left: "+=400" }, 1200) [code].....

Resizing The Photo Thumbnail In Website?
how to resize and make the thumbnail view of the photos like in facebook or other sites without distorting the photos

Resize The Main Photo And Not The Thumbnail?
I have a photo uploader in my admin area. First time I tried this so it's new to me. The upload form sends it to the page below, and does the resizing and saving. It seems to automatically resize the photos to make thumbnails, which is really nice. However, I am trying to do 2 things and can't figure it out. 1 - I would like to resize the main photo and not the thumbnail (or just use the thumbnail as the main photo, whichever seems easier). I would like it to be 690px wide but let it scale in proportion to what the height should be (not set a height as I think that's what it is doing now). This is the area where it gets resized: Code: [Select]{ $thumbnail_width = 690; $thumbnail_height = (int)(100 * $size[1] / $size[0]); } else { $thumbnail_width = (int)(690 * $size[0] / $size[1]); [Code]...

Blog Sized Photo And The Thumbnail Are Not Resized
the script takes an uploaded image, copies it to three locations, and resizes it accordingly to the gallery size, the thumbnail size and a blog size if required. to make the error even more confusing, if I upload this image of approx 22Kb, then the script works [URL] but if I upload this photo [URL] which is about 726Kb, then it correctly resizes one to 900 x whatever for the gallery photo, but the blog sized photo and the thumbnail are not resized - even though they are copied to the directory they remain unresized. <?php require_once ("inc.php") ; // upload the image // Copy the file storage area for uploaded files // relative to where this script is being run $store_dir = "../" . IMAGE_DIR ; [Code]...

Div - Create A Box That Moves When The 'A' Or 'D' Keys Are Pressed?
I need to create a box that moves when the 'A' or 'D' keys are pressed. This is the code that I have so far: <html xmlns=""> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> [code]....

Jquery :: Drag From A Scrollable Div To Droppable And Then Drag Again?
I have a scrollable list on the left of the page (overflow:auto) and several droppables on the right of the page. I found a workaround to allow an element to be dragged from the list to a container using a clone here but when the element is dropped, it gets position:absolute and a top and right position added to an inline style along with the z-index which was originally there. All other classes attached are in the copy, just that after the drag and drop, that element cannot be dragged again ? Is there a way to do this or to remove the inline style added by the cloning process ?[code]...