JQuery :: Causing Div To Resize Vertically?
Jun 12, 2009
I have a html list displayed in a div and I want to make the list cycle through items, i.e the first item in the list becomes the last item while the second one becomes the first, and this should continuously happen.
I wrote a small bit of jQuery to accomplish this, but the problem with this code is that is causes the block to continuously resize vertically. Does anyone know of a correction I could make to the code below to remove this glitch. Here is what I have written.
Code JavaScript:
$(document).ready(function() {
/**
* Removes the first element of the news-ticker elements and then calls
* addLast() to add it to the end of the list.
[Code].....
View 3 Replies
ADVERTISEMENT
Jan 18, 2010
I'm using the following piece of code to create a link that, when clicked, uses jquery animation to slowly display a paragraph of text. The trouble is that the animation goes both vertically and horizontally, making it look a little too busy/cluttery. How can I tweak my code to make it only animate vertically?
View 2 Replies
View Related
Oct 28, 2010
Im using the cycle plugin trying to make a banner slide tha is 100% the width of the window, my problem is that when i resize de window the banner does not align center, it stays somo what left align. So is there a way to keep the slides align center after you resize the window usingthe cycle plugin? or is there another plugin that i can do that? I attached a image to ilustrate, the white banner with the cat should align center when i resize the windows but it stays left align.
View 4 Replies
View Related
May 31, 2011
I'm trying to develop a function to resize a control upon window resize. In regular javascript I would make a global array of control names and append code to the event that cycles through and resizes each control.For example
var proportionalizedImages=new Array();
proportionalizedImages.push(document.getElementById(ctrl));
if (window.addEventListener)[code]....
I'm wondering if there's a more elegant way to do this in jQuery. I've played around with it a bit, but i'm unsure how to get the control object to the resize function triggered by window resize without a global variable.
jQuery.fn.resize = function(max_size) {
$(window).bind('resize', $(this), resizeTriggered);
}[code]....
View 2 Replies
View Related
May 15, 2011
I'm looking for a resize function that will resize a window around content, in my case a div.
I've googled away but not come up with anything as yet so would like to ask if anyone knows a plug in that can do this simple task.
View 1 Replies
View Related
Nov 19, 2011
I'm trying to scale the text with the size of the window (I've also got all the layout sizes in ems, so this should keep the aspect ratio of everything the same as the window is resized). The code that I've got at the moment doesn't do anything -
$(window).resize(function() {
var $width = $window.width() / 10;
$("body").css("font-size", $width);
});
View 1 Replies
View Related
Mar 29, 2010
I am using ASP.NET for data retrieval and jQuery to perform various functions/animations (error bar, slide menu, table sorter, etc...). Everything is working great until the pages are viewed over and SSL connection. When viewing over SSL, some of the margins/padding stops working and the hover effects on tables stop working correctly (leaving cells coloured, not colouring others). After spending a day looking for the solution in Google, I haven't found anything that will fix the issue. No errors/warnings are displayed on the page.
View 1 Replies
View Related
Apr 27, 2011
I want to achieve a similar effect using jquery and in div's not tables,[URL]
View 2 Replies
View Related
Apr 20, 2010
I'm trying to write a function to center a div within a parent div, and I'm having a little trouble. Horizontally, it works fine. Vertically, not so much.
This is my function:
function centerObject(idName, idParent) {
var parentLeft = $(idParent).position().left;
var parentWidth = $(idParent).width();
var parentWCenter = parentWidth / 2;
var parentTop = $(idParent).position().top;
var parentHeight = $(idParent).height();
var parentHCenter = parentHeight / 2;
var objWidth = $(idName).width();
var objWCenter = parentLeft + parentWCenter - (objWidth / 2);
var objHeight = $(idName).height();
var objHCenter = Math.abs(parentTop + parentHCenter - (objHeight / 2) - 20);
$(idName).css({left:objWCenter,top:objHCenter});
};
The line with the Math.abs call is necessary because without it, the given div ends up halfway off the page up at the top. At least this way it appears somewhere within the browser. The divs in question are all set to position: absolute, but I've tried setting them to all the other possibilities without luck. Or maybe I missed something. This happens in any browser... IE, FF, Chrome, Safari, etc.
View 2 Replies
View Related
Feb 9, 2010
i've been wrestling with this issue for the last hour. I can't seem to get thiscentreddiv to animate properly.What it currently does:A small div, (10x2px) expands to full 100% width and 100% height. However, it expands in the bottom right hand corner of the screen.
What I am trying to get it to do: To expand equally in all four directions.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
[Code].....
View 2 Replies
View Related
Mar 5, 2011
I'm using the fgMenu plugin [URL] to style our select menus. Does anyone know how to force the menu to open beneath where the menu is clicked to be opened? If you click on the first menu here ...
[URL]
you will notice that the menu opens above the click, and the top part is cut off. I would prefer the menu opens below the click, and someone can scroll to see all options.
View 2 Replies
View Related
Sep 22, 2009
Is it possible to rotate text so that is displays vertically using jQuery?
View 2 Replies
View Related
Jun 12, 2009
Is there a jquery plugin that can scroll text in a div vertically?I have div with a set height that is filled with more content than can be seen.I'm looking for a way to vertically scroll the text or some way to page thru the content.
View 2 Replies
View Related
Mar 30, 2010
I am a noob when its comes to Javascript. I used two different coda like sliders for two of my sites, one of them expands vertically based on the content, the other does not. This is the site I created that will demonstrate the effect I am going for. It is a more robust coda script [URL] This is the site I am creating that DOES NOT expand vertically as I would like. I would like it to behave the same as the site above. (had to use a smaller script to function in wordpress CMS) [URL]
View 3 Replies
View Related
Dec 6, 2011
I have a situation where i need to locate a radio button by it's value and check it. The solution below works in all browsers. However, in IE 6 & 7 (not 8), if there's an apostrophe it blows up.It's happening for me in both jQuery 1.6.4 and 1.7.1. Here's an example. var diagnosis = "Huntington's Disease"; $(...).find('input[value="' +diagnosis+ '"]').attr('checked','checked'); I've tried diagnosis.replace("'","'") and that seems to have no affect.
View 4 Replies
View Related
Jun 23, 2010
I believe I'm having an issue with the jQuery Cycle plugin. For the duration of the occurrence of a transition, the page appears to be "jumping" due to the fact that the site content is centered vertically and horizontally and the transition is making (inactive) scrollbars disappear entirely. I have not witnessed this personally in Safari/Firefox on Mac or Firefox/IE8 on Windows, but a colleague took a video of it happening on their machine with Firefox (Mac). Some see this problem, and others don't—I haven't been able to narrow it down. I also can't put overflow:hidden; on <body>, as I need the site to scroll if the browser window is too small.Here's the video, it's a 1.8 MB QuickTime file:[URL]
View 1 Replies
View Related
Mar 24, 2010
I am implementing a fairly large Javascript file that has many if/than's that decide whether to load new content into div's. I have noticed this is causing high client side CPU utilization. Is there any better way to do this besides having the example script below repeated many times... i need to keep CPU usage down.
Code:
<script>
$(document).ready(function()
{
//ajaxTime.php is called every second to get time from server
[Code]....
View 14 Replies
View Related
Sep 19, 2009
In order to allow users to filter content, I've created a small checkbox list. To each checkbox is attached an ID, and too some divs on the page are attached these id's too (in the class attr that is); one div can be attached to multiple id's, and so have multiple classes.
In order to show or hide my div's I wrote :
function couponsVisibles(){
$('.checkInteret').each(function(){
var coche = $(this).attr("checked");
if (coche) {
var idCoupons = $(this).attr("id");
$(".zoneCoupon , div[class='" +idCoupons+ "']").each(function(){
$(this).fadeIn();
});
}});
}
$(".checkInteret").click(function(){
var coche = $(this).attr("checked");
if (!coche) {
var idCoupons = $(this).attr("id");
$(".zoneCoupon , div[class='" +idCoupons+ "']").each(function(){
$(this).fadeOut();
});
}couponsVisibles();
});
It looks like my selector "$(".zoneCoupon , div[class='" +idCoupons+"']")" doesn't work, but I can't figure out why. I've started using the [attribute*=value] selector, but this selector doesn't seem to make a difference beetween class='8 10' and class='8 1'...
View 1 Replies
View Related
Sep 17, 2009
Major JQuery noob here. I'm working on a directory for a client's site and for some reason, in Firefox, the page is running really long with extra whitespace at the bottom where each tabbed div should end.[URL]...
View 1 Replies
View Related
Jan 20, 2011
I have 2 fixed divs in the site I'm developing. One of them is just a tab and the other div is a contact panel. These divs alternate - if the user clicks on the tab, the tab is hidden, and the panel shows and vice versa. Everything works great. Except that when I click on the link to hide either tab or the panel, the page behind it scrolls to the top. I would like the panel to show/hide but for the page behind it to be unaffected.
// Configure Contact Us panel on page load
$('#contacton').hide();
$('#contactoff').show();
var contacting = false;
[Code].....
View 5 Replies
View Related
Jul 6, 2009
I'm trying to get some thumbnail images that are displayed with ClueTip to be centered vertically & horizontally. The images are various sizes, though none is larger than 150px on a side, so I set ClueTip to have a width & height of 200px. The images are wrapped in a div so that I can have them display: none by default, yet assign display: block to the images themselves.
div.DownloadStatsThumb { display: none; vertical-align: middle; }
img.DownloadStatsThumb { display: block; margin: auto; }
The markup looks like so:
<a href="#" rel="#thumb_456" title="">foo</a>
<div class="DownloadStatsThumb" id="thumb_456">
<img src="/path/to/some/image.jpg"
width="150" height="101" alt="thumbnail image"
class="DownloadStatsThumb" />
</div>
The images are always aligned left & top. Eventually, I figured out that it was div#cluetip-inner that was the culprit. While the outer div has a height and width, the inner div has display:inline-block and so was shrinking down to the img size, essentially. I then added:
onActivate: function(e){
$('#cluetip-inner')
.css('display', 'block')
.css('width', '186px')
.css('height', '186px')
.css('vertical-align', 'middle')
.css('background-color', '#000');
return true;
}
The 186px is to avoid getting scrollbars and the BG color is to assure myself that it's resizing ok. However, the images remain centered horizontally only. Is there something else I've missed?
View 1 Replies
View Related
Jan 13, 2012
Im looking for something that would allow a user to click on a button / link that would then reveal hidden content by sliding the whole of the main site content / container down.
I found this which slides the page content to the left or right [URL]
But need something vertical, almost as if the whole site was a big vertical accordian.
Or like on twitter / facebook phone app when refreshing for new tweets etc.
View 2 Replies
View Related
Dec 7, 2010
I am new to using jquery and had a question about the slider that I use on my portfolio [URL]. The slider works perfectly but the one issue I have is that whilst it is loading you can see all the images that are used in it tiled vertically, overlapping the text and the rest of the site. It basically looks very ugly whilst loading so I was wondering if there is a way to hide the images whilst it loads, or if there is another alternative?
View 3 Replies
View Related
Feb 18, 2010
I am using a timer to fadeOut and fadeIn some articles such that 5 articles are displayed in rotation.However, for some reason the call to fadeIn or fadeOut is causing the page to change it's y scroll position. If I am currently at the bottom of the page, the fadeIn call causes the page to scroll up.
View 2 Replies
View Related
Sep 20, 2010
I'm using a .click event handler to add new classes to 9 list items. It does this perfectly, but once it's been clicked it reloads the page and everything resets!Here's the jQuery:
$("#diamond").click( function() {
$("#storage ul li#1").addClass("box1-diamond");
$("#storage ul li#2").addClass("box2-diamond");
[code]....
View 2 Replies
View Related
May 29, 2009
I have a very simple image rotator that brings in images then rotates through them using fadein/out.
You can see it going here: [URL]. If you scroll down to the bottom of the page then wait a few seconds the main image will rotate and the browser will jump up (almost as if it's going to an anchor).
The images are brought in to a 100% div and the images are specified to 100% width (not sure if this is related but I'd thought i'd let you know!).
The code I'm using is this:
function run_slides(id){
var curid;
var nextid;
curid=id;
[Code].....
View 1 Replies
View Related
