scroll position - Page 92

How can I take zooming into account when a user touches a UIScrollView?

- by Bill

I have a UIImageView inside of a UIScrollView. The parent scroll view allows zooming and panning. When the user taps a point in the scroll view, I want to find the location in the raw image inside the UIImageView - i.e. I want the point after including any zooming and panning the user has done in the scroll view. Right now, I have a UIScrollView subclass called ForwardingScrollView that handles touch events and attempts to convert them into locations in the coordinate system of the child image view. I tried adding contentOffset to these points, tried multiplying them by zoomScale, and even tried doing both. I also tried calling [touch locationInView: self] and [touch locationInView: parent], but none of these methods correctly return the point that I clicked in the underlying image. What's the best way to do this? Thanks in advance.

Read the article

Manipulating original elements with qTip

- by pjotr

I have a bunch of divs on my page and each of them has only the class attribute. In the divs there are some spans, which are set up to display a tooltip with the help of qTip. The tooltip should contain three items: Up: anchor, which should move the OuterDiv up (probably something like this: move up/down in jquery) Down: anchor, which should move the OuterDiv down Delete: anchor, which should remove the calling OuterDiv My code so far: <body> <div class="OuterDiv"> <div class="InnerDiv"> <span class="Position">Position 1</span> </div> </div> <div class="OuterDiv"> <div class="InnerDiv"> <span class="Position">Position 2</span> </div> </div> </body> And scripts: $(document).ready(function () { var qTipContent = '<a href="javascript:void(0)" onclick="">↑</a>   '; qTipContent = qTipContent + '<a href="javascript:void(0)" onclick="">↓</a>   '; qTipContent = qTipContent + '<a href="javascript:void(0)" onclick="">X</a>'; $('.Position').each(function () { $(this).qtip({ content: qTipContent, hide: { fixed: true } }) }); }); How should the onclick function in the qTip content look like?

Read the article

Assigning two strings together getting Access Read Violation

- by Jay Bell

I am trying to pass a string to a class mutator and set the private member to that string here is the code that is sending the string void parseTradePairs(Exchange::Currency *curr, std::string *response, int begin, int exit) { int start; int end; string temp; string dataResponse; CURL *tempCurl; initializeCurl(tempCurl); int location = response->find("marketid", begin); if(location <= exit) { start = location + 11; begin = response->find("label", start); end = begin - start - 3; findStrings(start, end, temp, response); getMarketInfo(tempCurl, temp, dataResponse); curr->_coin->setExch(temp); // here is the line of code that is sending the string dataResponse >> *(curr->_coin); curr->_next = new Exchange::Currency(curr, curr->_position + 1); parseTradePairs(curr->_next, response, begin, exit); } } and here is the mutator within the coin class that is receiving the string and assigning it to _exch void Coin::setExch(string exch) { _exch = exch; } I have stepped through it and made sure that exch has the string in it. "105" but soon as it hits _exch = exch; I get the reading violation. I tried passing as pointer as well. I do not believe it should go out of scope. and the string variable in the class is initialized to zero in the default constructor but again that should matter unless I am trying to read from it instead of writing to it. /* defualt constructor */ Coin::Coin() { _id = ""; _label = ""; _code= ""; _name = ""; _marketCoin = ""; _volume = 0; _last = 0; _exch = ""; } Exchange::Exchange(std::string str) { _exch = str; _currencies = new Currency; std::string pair; std::string response; CURL *curl; initializeCurl(curl); getTradePairs(curl, response); int exit = response.find_last_of("marketid"); parseTradePairs(_currencies, &response, 0, exit); } int main(void) { CURL *curl; string str; string id; Coin coin1; initializeCurl(curl); Exchange ex("cryptsy"); curl_easy_cleanup(curl); system("pause"); return 0; } class Exchange { public: typedef struct Currency { Currency(Coin *coin, Currency *next, Currency *prev, int position) : _coin(coin), _next(next), _prev(prev), _position(position) {} Currency(Currency *prev, int position) : _prev(prev), _position(position), _next(NULL), _coin(&Coin()){} Currency() : _next(NULL), _prev(NULL), _position(0) {} Coin *_coin; Currency *_next; Currency *_prev; int _position; }; /* constructor and destructor */ Exchange(); Exchange(std::string str); ~Exchange(); /* Assignment operator */ Exchange& operator =(const Exchange& copyExchange); /* Parse Cryptsy Pairs */ friend void parseTradePairs(Currency *curr, std::string *response, int begin, int exit); private: std::string _exch; Currency *_currencies; }; here is what i changed it to to fix it. typedef struct Currency { Currency(Coin *coin, Currency *next, Currency *prev, int position) : _coin(coin), _next(next), _prev(prev), _position(position) {} Currency(Currency *prev, int position) : _prev(prev), _position(position), _next(NULL), _coin(&Coin()){} Currency() { _next = NULL; _prev = NULL; _position = 0; _coin = new Coin(); } Coin *_coin; Currency *_next; Currency *_prev; int _position; };

Read the article

cant get jquery hover to work with .live()

- by Haroldo

the second function isnt working? $('.edit_hover').live('hover', function(e){ $(this).stop(); var half_width = ($(this).css('width').slice(0, -2))/2; var half_height = ($(this).css('height').slice(0, -2))*0.3; console.log(half_width); var top = ($(this).position().top) + half_height; var left = ($(this).position().left) + half_width; $('#edit_hover').css('top', top).css('left', left).fadeIn(300); //add overlay $(this).css('position', 'relative').append('<div class="edit_overlay" style="position: absolute; top:0px; left:0px; height:100%; width: 100%; background: #999; opacity: 0.5;"></div> ') }, function(){ $(this).stop(); $(this).find('.edit_overlay').remove(); $('#edit_hover').fadeOut(300); });

Read the article

mvc partial views loses track of the images folder when using jquery

- by jvelez

This is what I have and it works: $(function(){ $('.slide-out-div').tabSlideOut({ tabHandle: '.handle', //class of the element that will become your tab pathToTabImage: 'http://mhmiisdev2/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css imageHeight: '122px', //height of tab image //Optionally can be set using css imageWidth: '40px', //width of tab image //Optionally can be set using css tabLocation: 'right', //side of screen where tab lives, top, right, bottom, or left speed: 300, //speed of animation action: 'click', //options: 'click' or 'hover', action to trigger animation topPos: '200px', //position from the top/ use if tabLocation is left or right leftPos: '20px', //position from left/ use if tabLocation is bottom or top fixedPosition: true //options: true makes it stick(fixed position) on scroll }); }); This is what I want and it doesnt work when I change from one controller to another controller. NOTICE THE IMAGE PATH IS NOT ABSOLUTE $(function(){ $('.slide-out-div').tabSlideOut({ tabHandle: '.handle', //class of the element that will become your tab pathToTabImage: '/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css imageHeight: '122px', //height of tab image //Optionally can be set using css imageWidth: '40px', //width of tab image //Optionally can be set using css tabLocation: 'right', //side of screen where tab lives, top, right, bottom, or left speed: 300, //speed of animation action: 'click', //options: 'click' or 'hover', action to trigger animation topPos: '200px', //position from the top/ use if tabLocation is left or right leftPos: '20px', //position from left/ use if tabLocation is bottom or top fixedPosition: true //options: true makes it stick(fixed position) on scroll }); }); the html for completeness.... <div class="slide-out-div"> <a class="handle" href="http://link-for-non-js-users.html">Content</a> <h3>Medical Variance Reports</h3> <div> <ul> <li><a href="http://mhmssrs2/Reports/Pages/Report.aspx?" target="_blank">Individual Medicines</a></li> </ul> </div> </div> I suspect somehow pathToTabImage: /images/contact_tab.gif' loses its context when browsing throught controllers. Help me understand...

Read the article

javascript really strange behaviour

- by teehoo

I have the following code if (msg.position == 0) //removed for brevity else if (msg.position == txtArea.value.length) //removed for brevity } else { //ERROR: should not reach here. errorDivTag.innerHTML += msg.position + " " + txtArea.value.length; } I'm having some really weird situations where I'm getting the error in the last code block, but the printed positions show that msg.position is in fact equal to the txtArea.value.length. This only happens 1% of the time, almost as if I have some kind of race-condition in my code where the two are NOT equal during the second if statement, but equal when I print in the error message. Any ideas?

Read the article

changing existing duplicate entries in mysql

- by Mladen

sorry for the (probably) noob question, but I', new at this stuff. i have a table that has column 'position', and I want to, when inserting a new row, change positions of every row that has position lower than row that is inserted. for example, if I add row with position 4, if there is a duplicate, it should become 5, 5 should shift to 6 and so on... also, is there a way to get highest value for column besides testing it in every row via php?

Read the article

Jquery - how to create a sophisticated sidebar that smoothly scrolls down with you

- by Gal

I probably couldn't depict it better in the title (and if it has a term let me know), but just to quell the obscurity, I was referring to something like this. After you wait for the page to load, see how when you scroll down, the social media left bar stays fixed, but then when you scroll just enough that it meets your upper side, it sticks to it as you scroll further. I wanted to implement something corny and pretentious like that, so does anybody know a tutorial or a method to get that done in jquery? (I can probably do it myself, if I'm not mistaken, just need some sense of direction from savvy jqueryists). Is there a way to know when and how much a user scrolls? Can it be done with id's like the # url appendix to jump to a specific element? Just some ideas...

Read the article

Collision between 2 objects of the same class

- by user1826033

Okay, so I have an enemy class(With rotation, position, texture and so on). I spawn a few enemies on the screen, they move around, but they overlap each other. So I tried to do a collision check between two enemies of the same class. But no matter what method I try, it isn't quite working. The best thing I tried was: foreach (Enemy enemy1 in enemies) { enemy1Pos = new Vector2(enemy1.position.X, enemy1.position.Y) foreach (Enemy enemy2 in enemies) { enemy2Pos = new Vector2(enemy2.position.X, enemy2.position.Y) if (Vector2.Distance(enemy2Pos, enemy1Pos) < 200) { enemy1Pos += new Vector2((float)(enemy1.Speed * Math.Cos(enemy1.Rotation)), (float)(enemy1.Speed * Math.Sin(enemy1.Rotation))); } } } This is not to exact code, so it might have some mistakes in it. Anyway when i implemented this solution, the enemies were not overlapping so everything was fine on that part. But, they were always moving to the right side of the screen. I've also looked up flocking etc, but I would like to know, how can I detect collision between 2 objects of the same class?

Read the article

Square collision detection problem (iPhone).

- by thyrgle

Hi, I know I've probably posted three questions related to this then deleted them, but thats only because I solved them before I got an answer. But, this one I can not solve and I don't believe it is that hard compared to the others. So, with out further ado, here is my problem: So I am using Cocos2d and one of the major problem is they don't have buttons. To compensate for there lack in buttons I am trying to detect if when a touch ended did it collide with a square (the button). Here is my code: - (void)ccTouchesEnded:(NSSet*)touches withEvent:(UIEvent*)event { UITouch *touch = [touches anyObject]; CGPoint location = [touch locationInView:touch.view]; NSLog(@"%f", 240-location.y); if (isReady == YES) { if (((240-location.y) <= (240-StartButton.position.x - 100) || -(240-location.y) >= (240-StartButton.position.x) + 100) && ((160-location.x) <= (160-StartButton.position.y) - 25 || (160-location.x) >= (160-StartButton.position.y) + 25)) { NSLog(@"Coll:%f", 240-StartButton.position.x); CCScene *scene = [PlayScene node]; [[CCDirector sharedDirector] replaceScene:[CCZoomFlipAngularTransition transitionWithDuration:2.0f scene:scene orientation:kOrientationRightOver]]; } } } Do you know what I am doing wrong?

Read the article

In C++, I want to implement a ring iterator for a deque that contains a personally defined class.

- by George

I have a function of a "Table" class that should add a player to the table. I decided that if the seat is taken, the function should try and go through all the seats and add the player to the next available seat. How do I implement this in my addPlayer function? int Table::addPlayer(Player player, int position) { deque<Player>::iterator it; if(playerList[position] != "(empty seat)") { //What goes here? } playerList.put(player,it); cout >> "Player " >> player.toString >> " sits at position " >> position >> endl; }

Read the article

dynamic element positioning

- by Ahmet vardar

Hi, I have been seeing this thing for months and years and i really wanna know how to do that one. For example, there is an element in the middle of the page. and it is in absolute position. When scroll downs and comes to that element, it becomes fixed positioned and follows the scroll, when scroll up and back to middle of the page it becomes absolute again. I can give google adwords accounts page as an example, in the campaigns page, your keywords' header is the same thing. how to do that one ? thanks

Read the article

Have my UIPickerView having the same behavior than the keyboard.

- by camilo

Hi. So I have a UITableView where one of its rows is a UITextView. When the user is writing something to UITextView (using the keyboard) the user can scroll the tableview and select another cell. Everything works. When the user selects another cell, a datePicker appears, and the user can select a given date. I want the user to be able to scroll the tableView the same way like when the keyboard is on the screen. The problem here is that when I scroll with the picker, the table bounces back to the previous position (with some cells hidden by the picker). I assume that this happens because I add the picker to the main window, as a subview... but I'm honestly not sure... Where (and how) should I add my picker so that it "appears" where the keyboard appears? Not sure I was clear... Thanks a lot.

Read the article

Enable vertical scrolling on textarea

- by Hozefa

I have a textarea that I want to enable vertical scrolling. When I exceed the height of the textarea, it increases in size. The scroll bar does not appear. I want that a vertical scroll bar appears and the users are not able to resize the text area as well. I searched online and tried solutions posted, but none seem to work. Demo: http://jsfiddle.net/hozefa/8fv6e/ CSS: #imageURLId{ font-size: 14px; font-weight: normal; resize: none; overflow-y: scroll; } HTML: <label for="aboutDescription" id="aboutHeading">About</label> <textarea rows="15" cols="50" id="aboutDescription" style="resize: none;"></textarea> <a id="imageURLId" target="_blank">Go to HomePage</a>

Read the article

understanding and implementing Boids

- by alphablender

So I'm working on porting Boids to Brightscript, based on the pseudocode here: http://www.kfish.org/boids/pseudocode.html I'm trying to understand the data structures involved, for example is Velocity a single value, or is it a 3D value, ie velocity={x,y,z} It seems as if the pseudocode seems to mix this up where sometimes it has an equation that incudes both vectors and single-value items: v1 = rule1(b) v2 = rule2(b) v3 = rule3(b) b.velocity = b.velocity + v1 + v2 + v3 If Velocity is a tripartite value then this would make sense, but I'm not sure. So my first question here is, is this the correct datastructure for a single boid based on the Pseudocode on that page: boid={position:{px:0,py:0,pz:0},velocity:{x:0,y:0,z:0},vector:{x:0,y:0,z:0},pc:{x:0,y:0,z:0},pv:{x:0,y:0,z:0}) where pc=perceived center, pv= perceived velocity I"ve implemented a vector_add, vector_sub, vector_div, and vector boolean functions. The reason I'm starting from this pseudocode is I've not been able to find anything else that is as readable, but it still leaves me with lots of questions as the data structures are not explicitly defined for each variable. (edit) here's a good example of what i'm talking about: IF |b.position - bJ.position| < 100 THEN if b.position - b[j].position are both 3D coordinates, how can they be considered "less than 100" unless they are < {100,100,100} ? Maybe that is what I need to do here, use a vector comparison function?

Read the article

How do I get the value of the item selected in ListView?

- by user357032

I thought I could use the position int, but when I click on the item in the list view, nothing happens. Please help! ListView d = (ListView) findViewById(R.id.apo); ArrayAdapter adapt = ArrayAdapter.createFromResource(this, R.array.algebra, android.R.layout.simple_list_item_1); d.setAdapter(adapt); d.setOnItemClickListener(new OnItemClickListener() { public void onItemClick(AdapterView<?> parent, View view, int position, long id) { if (position == '0') { Intent intent = new Intent(Algebra.this, Alqv.class); startActivity(intent); } if (position == '2') { Intent intent1 = new Intent(Algebra.this, qfs.class); startActivity(intent1); } }); }

Read the article

finding character in string C language

- by iSight

Hi, I am searching a character at first occurence in string using the following code. But, it is taking some time when the character is too long or the character that i am searching is at far extend, which makes delay in other operations. How could i tackle with this problem. The code is below here. Note: attrPtr is a char* which holds a reference to a string containing '"' character at far extend. int position = 0; char qolon = '"';//character to search while (*(attrPtr + position++) != qolon); char* attrValue = NULL; attrValue = (char*)malloc(position * sizeof(char)); strncpy(attrValue, attrPtr, position-1);

Read the article

Can I dynamically adjust the height of a css set div border?

- by Jeff

Ok so I have a div that contains a few forms that have dynamically generated content. There are categories, that if you click on, slide/toggle down to reveal that categories sub-contents, or projects. Right now, I have it setup so that if the height of the div expands to exceed a set amount, a scroll bar shows up at the side, and the user can scroll down and see the content. NOW I am being asked to get rid of the scroll bar, and just have the div's border (which is just 1px set in the css) height adjust dynamically with the height of the div's content...can I even do that? Is there some sort of jquery animation that would allow that? A point in the right direction would be greatly appreciated!! Thanks

Read the article

determining the starting speed for an accelerated animation (in flash/actionscript but it's a math question)

- by vulkanino

This question burns my brain. I have an object on a plane, but for the sake of simplicity let's work just on a single dimension, thus the object has a starting position xs. I know the ending position xe. The object has to move from starting to ending position with an accelerated (acceleration=a) movement. I know the velocity the object has to have at the ending position (=ve). In my special case the ending speed is zero, but of course I need a general formula. The only unknown is the starting velocity vs. The objects starts with vs in xs and ends with ve in xe, moving along a space x with an acceleration a in a time t. Since I'm working with flash, space is expressed in pixels, time is expressed in frames (but you can reason in terms of seconds, it's easy to convert knowing the frames-per-second). In the animation loop (think onEnterFrame) I compute the new velocity and the new position with (a=0.4 for example): vx *= a (same for vy) x += vx (same for y) I want the entire animation to last, say, 2 seconds, which at 30 fps is 60 frames. Now you know that in 60 frames my object has to move from xs to xe with a constant deceleration so that the ending speed is 0. How do I compute the starting speed vs? Maybe there's a simpler way to do this in Flash, but I am now interested in the math/physics behind this.

Read the article

Is it possible to define XML scheme with node names specified via regular expressions?

- by MartyIX

Hello, I know it is probably a question against XML philosophy but still is it possible to define scheme for XML like this: <Root> <arbitrary-name-of-node> <Name></Name> <Position></Position>  </arbitrary-name-of-node> <arbitrary-name-of-node> <Name></Name> <Position></Position>  </arbitrary-name-of-node> </Root> where arbitrary-name-of-node matches regular expression [a-zA-Z0-9]? Thanks for an answer!

Read the article

jQuery can't get if statement to work

- by jstacks

I'm looking help with an If Statement. I'm trying to finalize this horizontal scrolling I have and the last bit is to not just disable scrolling when the end is reached, but to also disable (well, change color) the scroll buttons at that point as well. And change back when they are scrollable again. http://jsfiddle.net/stfzy/83/ EDIT* I've updated the JQuery and have everything working except just one if statement: $('div#arrowL').click(function(){ if(index < 0 ){ //can't scroll $('div#arrowL').addClass('active'); } }); I need to add this class back when you can't scroll left anymore. And I think the issue is with the "index < 0" portion but I don't see what I need to change it to to get it to work. Any help is appreciated.

Read the article

EXC_BAD_ACCESS when returning a CGRect in iPhone

- by pabloruiz55

I have a class which must return a CGRect from one of its methods: -(CGRect)myRect { CGRect rect = CGRectMake(self.mySprite.position.x,self.mySprite.position.y,self.mySprite.textureRect.size.width, self.mySprite.textureRect.size.height); return rect; } I get an exc_bad_access as soon as i try to access the mySprite ivar. Thing is if i call it, the instance variable mySprite is full of garbage. BUT if i change the function to return void, self.mySprite does contain the correct data. -(void)myRect { CGRect rect = CGRectMake(self.mySprite.position.x,self.mySprite.position.y,self.mySprite.textureRect.size.width, self.mySprite.textureRect.size.height); return rect; } that does not crash when accessing mySprite...

Read the article

Popovercontroller doesn't display full

- by user2959234

I have an UIPopovercontroller in with an content that generate from an viewcontroller. popOverController = [[UIPopoverController alloc]initWithPopUp:emLightPopUp]; popOverController.delegate = self; // Get device position. CGRect position = {parentButton.frame.origin,emLightPopUp.popUpView.frame.size}; CGSize popUpViewFrameSize = emLightPopUp.popUpView.frame.size; Link screenshot: http://i.stack.imgur.com/AxqoG.png The issue is that when I change the position of select devices (touched button) upwards, the displayed popup will be resized like the screenshot. I already try to set content size inside the subclass of uipopover but it still doesn't work: self.popoverContentSize = emLightPopUp.popUpView.frame.size; EDIT: I solved this problems by calculate the position that display the popup and scroll the scrollview inside into an upper position. Check out this code: -(void)moveDeviceOutMiddleScreen:(id)deviceButton { UIButton* button = (UIButton*)deviceButton; CGFloat yPositionRange = button.frame.origin.y - self.floorZoomScrollView.contentOffset.y; int middle_top_y = 70; int middle_bottom_y = 166; if (yPositionRange > middle_top_y && yPositionRange < middle_bottom_y) { CGRect newRect = CGRectMake(self.floorZoomScrollView.contentOffset.x, self.floorZoomScrollView.contentOffset.y +yPositionRange*0.6, self.floorZoomScrollView.frame.size.width, self.floorZoomScrollView.frame.size.height); [self.floorZoomScrollView scrollRectToVisible:newRect animated:NO]; } } Thanks for your responses.

Read the article

Menu widget - no jQuery nor Javascript required - pure CSS

- by Renso

Goal: Create a menu widget that does not require any javascript, extremely lightweight, very fast, soley based on CSS, compatible with FireFox and Chrome. Issues: May have some rendering issues in some versions of IE, sorry :-) Instruments: css file html with specific menu format jQuery-ui library - optional if you want to use your own images/colors Implementation Details: HTML: <div id="header"> <div id="header_Menubar"> <ul class="linkList0 ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> <li class="first more ui-state-default ui-corner-top ui-tabs-selected"><a title="Home" href="/Home">Home</a> <ul class="linkList01 ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> <li class="ifirst ui-state-default ui-corner-top"><abbr title="Go Home"></abbr><a title="Home" href="/Home">Home</a></li> </ul> </li> <li class="more ui-state-default ui-corner-top ui-tabs-selected"><a title="Menu 2" href="/Menu2a">Menu 2</a> <ul class="linkList01 ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> <li class="ifirst ui-state-default ui-corner-top"><abbr title="Menu 2 a"></abbr><a title="Menu 2 a" href="/Menu2a">Menu 2 a</a></li> <li class="ilast ui-state-default ui-corner-top"><abbr title="Menu 2 b"></abbr><a title="Menu 2 b" href="/Menu2b">Menu 2 b</a></li> </ul> </li> <li class="more red ui-state-default ui-corner-top ui-tabs-selected"><a title="Menu 3" href="/Menu3 d">Menu 3</a> <ul class="linkList01 ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> <li class="ifirst ui-state-default ui-corner-top"><abbr title="Menu 3 a"><a title="Menu 3 a" href="/Menu3a">Menu 3 a</a></abbr></li> <li class="ui-state-default ui-corner-top"><abbr title="Menu 3 b"><a title="Menu 3 b" href="/Menu3b">Menu 3 b</a></abbr></li> <li class="ui-state-default ui-corner-top"><abbr title="Menu 3 c"><a title="Menu 3 c" href="/Menu3c">Menu 3 c</a></abbr></li> <li class="ilast ui-state-default ui-corner-top"><abbr title="Menu 3 d"><a title="Menu 3 d" href="/Menu3d">Menu 3 d</a></abbr></li> </ul> </li> </ul> </div> </div> CSS: /* =Menu ----------------------------------------------------------------------------------------- */ #header #header_Menubar { margin: 0; padding: 0; border: 0; width: 100%; height: 22px; } #header { background-color: #99cccc; background-color: #aaccee; background-color: #5BA3E0; background-color: #006cb1; } /* Set menu bar background color */ #header #header_Menubar { background-attachment: scroll; background-position: left center; background-repeat: repeat-x; } /* Set main (horizontal) menu typology */ #header .linkList0 { padding: 0 0 1em 0; margin-bottom: 1em; font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif; font-weight: bold; font-size: 1.085em; font-size: 1em; } /* Set all ul properties */ #header .linkList0, #header .linkList0 ul { list-style: none; margin: 0; padding: 0; list-style-position: outside; } /* Set all li properties */ #header .linkList0 > li { float: left; position: relative; font-size: 90%; margin: 0 0 -1px; width: 9.7em; padding-right: 2em; z-index: 100; /*IE7: Fix for IE7 hiding drop down list behind some other page elements */ } /* Set all li properties */ #header .linkList01 > li { width: 190px; } #header .linkList0 .linkList01 li { margin-left: 0px; } /* Set all list background image properties */ /*#header .linkList0 li a { background-position: left center; background-image: url( '../Content/Images/VerticalButtonBarGradientFade.png' ); background-repeat: repeat-x; background-attachment: scroll; }*/ /* Set all A ancor properties */ #header .linkList0 li a { display: block; text-decoration: none; line-height: 22px; } /* IE7: Fix for a bug in IE7 where the margins between list items is doubled - need to set height explicitly */ *+html #header .linkList0 ul li { height: auto; margin-bottom: -.3em; } /* Menu: Set different borders for different nested level lists -------------------------------------------------------------- */ #header .linkList0 > li a { border-left: 10px solid Transparent; border-right: none; } #header .linkList0 > li a { border-left: 0px; margin-left: 0px; border-right: none; } #header .linkList0 .linkList01 > li a { border-left: 8px solid #336699; border-right: none; border: 1px solid Transparent; -moz-border-radius: 5px 5px 5px 5px; -moz-box-shadow: 3px 3px 4px #696969; } #header .linkList0 .linkList01 .linkList001 > li a { border-left: 6px solid #336699; border-right: none; border: 1px solid Transparent; -moz-border-radius: 5px 5px 5px 5px; -moz-box-shadow: 3px 3px 4px #696969; } #header .linkList0 .linkList01 .linkList001 .linkList0001 > li a { border-left: 4px solid #336699; border-right: none; border: 1px solid Transparent; -moz-border-radius: 5px 5px 5px 5px; -moz-box-shadow: 3px 3px 4px #696969; } /* Link and Visited pseudo-class settings for all lists (ul) */ #header .linkList0 a:link, #header .linkList0 a:visited { display: block; text-decoration: none; padding-left: 1em; } /* Hide all the nested/sub menu items */ #header .linkList0 ul { display: none; padding: 0; position: absolute; /*Important: must not impede on other page elements when drop down opens up */ } /* Hide all detail popups */ #header .detailPopup { display: none; } /* Set the typology of all sub-menu list items li */ /*#header .linkList0 ul li { background-color: #AACCEE; background-position: left center; background-image: url( '../Content/Images/VerticalButtonBarGradientFade.png' ); background-repeat: repeat-x; background-attachment: scroll; }*/ #header .linkList0 ul li.more { background: Transparent url('../Content/Images/ArrowRight.gif') no-repeat right center; } /* Header list's margin and padding for all list items */ #header .linkList0 ul li { margin: 0 0 0 1em; padding: 0; } #header .linkList01 ul li { margin: 0; padding: 0; width: 189px; } /* Set margins for the third li sibling (Plan a Call) to display to the right of the parent menu to avoid the sub-menu overlaying the menu items below */ #header .linkList0 li.more .linkList01 li.more > ul.linkList001 { margin: -1.7em 0 0 13.2em; /*Important, must be careful, if tbe EM since gap increases too much bewteen nested lists the gap will make the nested-list collapse prematurely */ } /* Set right hand arrow for list items with sub-menus (class-more) */ #header li.more { background: Transparent url('../Content/Images/ArrowRight.gif') no-repeat right center; padding-right: 48px; } /* Menu: Dynamic Behavior of menu items (hover, visted, etc) ----------------------------------------------------------- */ #header .linkList0 li a:link, #header .linkList01 li a:link { display: block; } #header .linkList0 li a:visited, #header .linkList01 li a:visited { display: block; } #header .linkList0 > li:hover { } #header .linkList01 > li:hover a ,#header .linkList001 > li:hover a { text-decoration: underline; } #header .linkList0 > li abbr:hover span.detailPopup { display: block; position: absolute; top: 1em; left: 17em; border: double 1px #696969; border-style: outset; width: 120%; height: auto; padding: 5px; font-weight: 100; } #header .linkList0 > li:hover ,#header .linkList0 .linkList01 > li:hover { } #header .linkList0 .linkList01 .linkList001 > li:hover { } #header .linkList0 .linkList01 .linkList001 .linkList0001 > li:hover { } /* Display the hidden sub menu when hovering over the parent ul's li */ #header .linkList0 li:hover > ul { display: block; } /* Display the hidden sub menu when hovering over the parent ul's li */ #header .linkList0 .linkList01 li:hover > ul { display: block; background: -moz-linear-gradient(top, #1E83CC, #619FCD); /* Chrome, Safari:*/ background: -webkit-gradient(linear, center top, center bottom, from(#1E83CC), to(#619FCD)); } /* Display the hidden sub menu when hovering over the parent ul's li */ #header .linkList0 .linkList01 .linkList001 li:hover > ul { display: block; } /* Set right hand arrow for list items with sub-menus (class-more) on hover */ #header li.more:hover { } Also some CSS for global settings that will affect this menu, you of course will have some other styling, but included it here so you can see how/why some css properties were set here: /* Neutralize styling: Elements we want to clean out entirely: */ html, body { margin: 0; padding: 0; font: 62.5%/120% Verdana, Arial, Helvetica, sans-serif; } /* Neutralize styling: Elements with a vertical margin: */ h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address { margin: 0; /* most browsers set some default value that is not shared by all browsers */ padding: 0; /* some borowsers default padding, set to 0 for all */ } /* Apply left margin: Only to the few elements that need it: */ li, dd, blockquote { margin-left: 1em; }

Read the article

Weird CSS-behaviour [migrated]

- by WMRKameleon

<!DOCTYPE html> <html> <head> <title>PakHet</title> <link rel="stylesheet" type="text/css" href="css/basis.css" /> </head> <body> <div class="wrapper"> <div id='cssmenu'> <ul> <li class="active"><a href='index.html'><span>Start</span></a></li> <li><a href='pakhet.html'><span>Over PakHet</span></a></li> <li><a href='overons.html'><span>Over Ons</span></a></li> <li class='has-sub '><a href='#'><span>Uw pakket</span></a> <ul> <li><a href='aanmelden.php'><span>Aanmelden</span></a></li> <li><a href='traceren.php'><span>Traceren</span></a></li> </ul> </li> </ul> </div> <div class="header"> <h1>Hier komt de titel van de website</h1> </div> <div class="content"> <p>Dit is de tekst van de content. Dit is de indexpagina.</p> </div> </div> </body> </html> And this is the CSS: /* CSS RESET */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, *{ margin: 0; padding: 0; border: 0; vertical-align: baseline; } table { border-collapse: collapse; border-spacing: 0; } /* Einde CSS RESET, nu echte code */ html, body{ background:url(../images/bg_picture.jpg) fixed no-repeat; } .wrapper{ margin:0 auto; } .header{ margin:0 auto; background-color:rgba(0, 0, 0, 0.4); } .content{ background-color:rgba(0, 0, 0, 0.4); width:600px; margin:0 auto; margin-top:50px; } .content p{ color:white; text-shadow:1px 1px 0 rgba(0,0,0, 0.5); font-family:"Lucida Grande", sans-serif; } #cssmenu{ height:37px; display:block; padding:0; margin: 0; border:1px solid; } #cssmenu > ul {list-style:inside none; padding:0; margin:0;} #cssmenu > ul > li {list-style:inside none; padding:0; margin:0; float:left; display:block; position:relative;} #cssmenu > ul > li > a{ outline:none; display:block; position:relative; padding:12px 20px; font:bold 13px/100% "Lucida Grande", Helvetica, sans-serif; text-align:center; text-decoration:none; text-shadow:1px 1px 0 rgba(0,0,0, 0.4); } #cssmenu > ul > li:first-child > a{border-radius:5px 0 0 5px;} #cssmenu > ul > li > a:after{ content:''; position:absolute; border-right:1px solid; top:-1px; bottom:-1px; right:-2px; z-index:99; } #cssmenu ul li.has-sub:hover > a:after{top:0; bottom:0;} #cssmenu > ul > li.has-sub > a:before{ content:''; position:absolute; top:18px; right:6px; border:5px solid transparent; border-top:5px solid #fff; } #cssmenu > ul > li.has-sub:hover > a:before{top:19px;} #cssmenu ul li.has-sub:hover > a{ background:#3f3f3f; border-color:#3f3f3f; padding-bottom:13px; padding-top:13px; top:-1px; z-index:999; } #cssmenu ul li.has-sub:hover > ul, #cssmenu ul li.has-sub:hover > div{display:block;} #cssmenu ul li.has-sub > a:hover{background:#3f3f3f; border-color:#3f3f3f;} #cssmenu ul li > ul, #cssmenu ul li > div{ display:none; width:auto; position:absolute; top:38px; padding:10px 0; background:#3f3f3f; border-radius:0 0 5px 5px; z-index:999; } #cssmenu ul li > ul{width:200px;} #cssmenu ul li > ul li{display:block; list-style:inside none; padding:0; margin:0; position:relative;} #cssmenu ul li > ul li a{ outline:none; display:block; position:relative; margin:0; padding:8px 20px; font:10pt "Lucida Grande", Helvetica, sans-serif; color:#fff; text-decoration:none; text-shadow:1px 1px 0 rgba(0,0,0, 0.5); } #cssmenu, #cssmenu > ul > li > ul > li a:hover{ background:#333333; background:-moz-linear-gradient(top, #333333 0%, #222222 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#333333), color-stop(100%,#222222)); background:-webkit-linear-gradient(top, #333333 0%,#222222 100%); background:-o-linear-gradient(top, #333333 0%,#222222 100%); background:-ms-linear-gradient(top, #333333 0%,#222222 100%); background:linear-gradient(top, #333333 0%,#222222 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#222222',GradientType=0 ); } #cssmenu{border-color:#000;} #cssmenu > ul > li > a{border-right:1px solid #000; color:#fff;} #cssmenu > ul > li > a:after{border-color:#444;} #cssmenu > ul > li > a:hover{background:#111;} #cssmenu > ul > li.active > a{ color:orange; } .header{ clear:both; } The problem is that, whenever I hover on the dropdown-menu, that a 1px margin appears in between the menu and the header. Can I solve that? I can't seem to find the solution.

Search Results

Search found 10707 results on 429 pages for 'scroll position'.

Page 92/429 | < Previous Page | 88 89 90 91 92 93 94 95 96 97 98 99 | Next Page >

- by Bill

- by pjotr

- by Jay Bell

- by Haroldo

- by jvelez

- by teehoo

- by Mladen

- by Gal

- by user1826033

- by thyrgle

- by George

- by Ahmet vardar

- by camilo

- by Hozefa

- by alphablender

- by user357032

- by iSight

- by Jeff

- by vulkanino

- by MartyIX

- by jstacks

- by pabloruiz55

- by user2959234

- by Renso

- by WMRKameleon

< Previous Page | 88 89 90 91 92 93 94 95 96 97 98 99 | Next Page >