I have read people argue about which is the better placement for the jQuery script to go. In the head tag or just before the close of the body tag. So jQuery gurus which one would you guys recommend I use for my jQuery
I hired a programmer to develop a drag and drop system for my blog. The user should be able to browse one of my blog entries and click, drag and drop an image from my entry to a fixed bottom bar on that page.The problem we are facing is that when dragging an image, it wont place it on the bottom bar until the whole page is scrolled down to the bottom of the page. This is a problem because some of the pages can be very lengthy
I know css has a property position: fixed, but it's not work on IE6 how to keep a sqaure box width 100px and height 100px always stay at right bottom with 10px margin?
A website I've been working on has a black bar across the bottom. Under some conditions, however, there is a gap between the bar and the bottom of the page -- white for the body. The conditions vary between browsers and OSes. To keep things simple, I'll describe what happens with my principle development environment -- Chrome under Ubuntu.
The main body of the website is fixed width, centered against a neutral background. If the browser window is narrowed so that a horizontal scrollbar appears, the gap appears.
I have tried various things to find the gap so I can move the bar down or whatever but nothing seems to work. I tried using the document height but I found that it is greater than the actual display area which probably means that it is including something not visible (which is fine) but how do I reliably determine the extra? Or is there another solution I should be looking at (I won't bother listing all that I have tried)?
All expanding textarea plugins I've seen always insert an additional line at the very end. This signals the user that more text can be typed since there is more space (such as [URL]). But can anyone direct me to an expanding textarea plugin which doesn't add an extra space at the bottom? I want it to grow only to the exact number of lines which have been typed.
My div has this CSS on it: {height:300px;overflow-y:scroll;overflow-x:hidden;}
After loading some content with append() I want the scrollbar to move to the bottom of the div so the last row of the recently added content is visible, as if the user had moved the scrollbar to the bottom manually. I have tried all the obvious solutions: //lets assume I've got the height as vHeight from scrollHeight and it equals 800 $(elem).scrollTop(vHeight); $(elem).attr('scrollTop',vHeight); $(elem).animate({scrollTop: 800}, 'slow');
None works. I also tried using the DOM as in document.getElementById('elemId').scrollTop = vHeight. Nothing sets the scrollTop property.
I'am trying to create a text, which moves from the top to the bottom and the text which disappears at the bottom, comes in at the top. <div id="myFloatingText"> | V Here is my text which should be moved down and the line which disappear at the bottom should appear at the top. | V </div>
I've installed the jQuery autoscroll [URL], for my web page. I'm using it in a div tag for a news feed. The problem is that it is looping. Is there any way to make it stop at the bottom? And if its possible, is there any way to make it being able to scroll upwards again?
I was hoping there is some way to fix this, in IE7 and 9beta when you navigate between pages from my main nav the page loads scrolled to the bottom. It seems to be pretty random and will not reproduce consistently. Is there a way to force all anchors with a certain class to scroll to the top?
How to determine how a absoluted positioned element was positioned?
For example, a div positioned with bottom: 10px, will have a "top" read in Firefox. But if using "top" to move the box, instead of moving it, it will grow or shrink.
I'm trying to create an animation that would fill a complex shape (say an arrow) with a color from top to bottom. It'd be something similar to the third button in the button labEnter the site, go to button lab, select "Click Replaced by Timer". Can't link to it specifically cause it's all Flash).
I have to ad a line between some rows, but not for the first col.the table has:table { border-collapse: collapse }that is fix and I can not change it.the following sample code draws the lines nicely in IE6 but in FF there'sjust nothing (also used color here, to see if the selectors are right):
I'm building a site right now that has a left column navigation and the navigation is nested inside a div, which is nested inside a table cell (i.e., <td>). I'm using JQuery to make it so when the user scrolls down the page, the div slides down smoothly and always stays at the top of the page. I have this working just fine, but when I change resolutions (i.e., 1024x768), the div scrolls over the bottom of the page, which is what I don't want. How can I calculate in order for the div to know when it hast reached the bottom of the table cell? I tried using outerHeight to calculate the height of the table cell and then subtracting the height of the div from it, but I'm clearly doing it wrong because it's still not working. You can view the page I'm referring to at [URL].
The JS code I'm using is below. var name = "#scroller"; var menu_top_limit = 0; var menu_bottom_limit = $('#holder > #scroller').outerHeight() - 560; var menu_top_margin = -15; var menu_shift_duration = 500; var menuYloc = null; $(window).scroll(function(){ // Calculate the top offset, adding a limit offset = menuYloc + $(document).scrollTop() + menu_top_margin; // Limit the offset to 0 pixels... // This keeps the menu within it's containing TD boundaries if(offset < menu_top_limit){ offset = menu_top_limit; // Give it the PX for pixels: offset += "px"; } /*else if(offset > menu_bottom_limit){ offset = menu_bottom_limit; offset += "px"; }*/ // Animate: $(name).animate({top:offset}, {duration:menu_shift_duration,queue:false});
I'm trying to add the lightbox plugin to a page and when the image is clicked the overlay and corresponding image are pushed to the bottom of the page wit the image below the overlay. The gallery div is nested inside a couple other divs and when the gallery images are clicked the overlay and lighbox divs are pushed to the bottom of the page instead of being absolutely positioned over the existing content. If anyone has some ideas on how to fix this I would like to hear them.
I'm working on a website where we're using the jquery.linkselect plugin, and we're running into a situation where we have one of the dropdown linkselect menus happening near the very bottom of the users' window.
Imagine that we have a list of articles with abstracts, authors, etc. running down the left hand side in a div which is set to show a scrollbar if the results list gets long, and each article has a linkselect dropdown menu.
Unexpectedly, if you've scrolled to the bottom of the scrolling div and you're on the last item in the list, linkselect is allowing the menu to drop down extending past the bottom of the scrolling div and outside the boundary of the browser window. This is problematic, as it makes the menu items inaccessible.
We're looking for a way to have it automatically detect the bottom of the screen and reposition the menu accordingly (similarly to the way it does it to make sure it doesn't get positioned off the right hand side of the screen). I might be able to hack it, but was hoping maybe the linkselect team might be able to put something in more quickly and efficiently than I can. :)
Alternately, a way to specify that a menu drops up rather than drops down would also be a great solution to our situation (I didn't see that in the options.
I have built a site that loads new content from a database when the user hits the end of the page. This works fine in all desktop browsers and on the iPad, but is not working on the iPhone. Have tried an iPhone 3g and 4.
I am using Fancybox plugin and works well but for an ajax call the first few calls the popup/modal appears at the bottom of the window but later corrects itself and then is centered.
Here is an example:
Example Link
Click on the 'Foliage', 'Base' or 'Trunk' boxes in the right side column.
i'm using the 1.7.2/Slider and i'm quite pleased with it. The only thing that bothers me is how to change the direction of the slider when in vertical orientation. The default values are: min at bottom, max at top, but I want to reverse that, so the slider always starts from top to bottom. I tryed different things like modifying the code in ui.slider.js, but it didn't seem to work.