Search Results

Search found 17081 results on 684 pages for 'body background'.

Page 282/684 | < Previous Page | 278 279 280 281 282 283 284 285 286 287 288 289  | Next Page >

  • NuSOAP PHP Request From XML

    - by Tegan Snyder
    I'm trying to take the following XML request and convert it to a NuSOAP request and I'm having a bit of difficulty. Could anybody chime in? XML Request: <soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:dto="http://dto.eai.dnbi.com" xmlns:com="http://com.dnbi.eai.service.AccountSEI"> <soapenv:Header> <dto:AuthenticationDTO> <dto:LOGIN_ID>[email protected]</dto:LOGIN_ID> <dto:LOGIN_PASSWORD>mypassword</dto:LOGIN_PASSWORD> </dto:AuthenticationDTO> </soapenv:Header> <soapenv:Body> <com:matchCompany> <com:in0> <!--Optional:--> <dto:bureauName></dto:bureauName> <!--Optional:--> <dto:businessInformation> <dto:address> <!--Optional:--> <dto:city>Bloomington</dto:city> <dto:country>US</dto:country> <dto:state>MN</dto:state> <dto:street>555 Plain ST</dto:street> <!--Optional:--> <dto:zipCode></dto:zipCode> </dto:address> <!--Optional:--> <dto:businessName>Some Company</dto:businessName> </dto:businessInformation> <!--Optional:--> <dto:entityNumber></dto:entityNumber> <!--Optional:--> <dto:entityType></dto:entityType> <!--Optional:--> <dto:listOfSimilars>true</dto:listOfSimilars> </com:in0> </com:matchCompany> </soapenv:Body> </soapenv:Envelope> And my PHP code: <?php require_once('nusoap.php'); $params = array( 'LOGIN_ID' => '[email protected]', 'LOGIN_PASSWORD' => 'mypassword', 'bureauName' => '', 'businessInformation' => array('address' => array('city' => 'Some City'), array('country' => 'US'), array('state' => 'MN'), array('street' => '555 Plain St.'), array('zipCode' => '32423')), array('businessName' => 'Some Company'), 'entityType' => '', 'listOfSimilars' => 'true', ); $wsdl="http://www.domain.com/ws/AccountManagement.wsdl"; $client = new nusoap_client($wsdl, true); $err = $client->getError(); if ($err) { echo '<h2>Constructor error</h2><pre>' . $err . '</pre>'; echo '<h2>Debug</h2><pre>' . htmlspecialchars($client->getDebug(), ENT_QUOTES) . '</pre>'; exit(); } $result = $client->call('matchCompany', $params); if ($client->fault) { echo '<h2>Fault (Expect - The request contains an invalid SOAP body)</h2><pre>'; print_r($result); echo '</pre>'; } else { $err = $client->getError(); if ($err) { echo '<h2>Error</h2><pre>' . $err . '</pre>'; } else { echo '<h2>Result</h2><pre>'; print_r($result); echo '</pre>'; } } echo '<h2>Request</h2><pre>' . htmlspecialchars($client->request, ENT_QUOTES) . '</pre>'; echo '<h2>Response</h2><pre>' . htmlspecialchars($client->response, ENT_QUOTES) . '</pre>'; echo '<h2>Debug</h2><pre>' . htmlspecialchars($client->getDebug(), ENT_QUOTES) . '</pre>'; ?> Am I generating the Header information correctly? I think that may be where I'm off. Thanks,

    Read the article

  • How can I make a jQuery UI 'draggable()' div draggable for touchscreen?

    - by artlung
    I have a jQuery UI draggable() that works in Firefox and Chrome. The user interface concept is basically click to create a "post-it" type item. Basically, I click or tap on div#everything (100% high and wide) that listens for clicks, and an input textarea displays. You add text, and then when you're done it saves it. You can drag this element around. That is working on normal browsers, but on an iPad I can test with I can't drag the items around. If I touch to select (it then dims slightly), I can't then drag it. It won't drag left or right at all. I can drag up or down, but I'm not dragging the individual div, I'm dragging the whole webpage. So here's the code I use to capture clicks: $('#everything').bind('click', function(e){ var elem = document.createElement('DIV'); STATE.top = e.pageY; STATE.left = e.pageX; var e = $(elem).css({ top: STATE.top, left: STATE.left }).html('<textarea></textarea>') .addClass('instance') .bind('click', function(event){ return false; }); $(this).append(e); }); And here's the code I use to "save" the note and turn the input div into just a display div: $('textarea').live('mouseleave', function(){ var val = jQuery.trim($(this).val()); STATE.content = val; if (val == '') { $(this).parent().remove(); } else { var div = $(this).parent(); div.text(val).css({ height: '30px' }); STATE.height = 30; if ( div.width() !== div[0].clientWidth || div.height () !== div[0].clientHeight ) { while (div.width() !== div[0].clientWidth || div.height () !== div[0].clientHeight) { var h = div.height() + 10; STATE.height = h; div.css({ height: (h) + 'px' }); // element just got scrollbars } } STATE.guid = uniqueID() div.addClass('savedNote').attr('id', STATE.guid).draggable({ stop: function() { var offset = $(this).offset(); STATE.guid = $(this).attr('id'); STATE.top = offset.top; STATE.left = offset.left; STATE.content = $(this).text(); STATE.height = $(this).height(); STATE.save(); } }); STATE.save(); $(this).remove(); } }); And I have this code when I load the page for saved notes: $('.savedNote').draggable({ stop: function() { STATE.guid = $(this).attr('id'); var offset = $(this).offset(); STATE.top = offset.top; STATE.left = offset.left; STATE.content = $(this).text(); STATE.height = $(this).height(); STATE.save(); } }); My STATE object handles saving the notes. Onload, this is the whole html body: <body> <div id="everything"></div> <div class="instance savedNote" id="iddd1b0969-c634-8876-75a9-b274ff87186b" style="top:134px;left:715px;height:30px;">Whatever dude</div> <div class="instance savedNote" id="id8a129f06-7d0c-3cb3-9212-0f38a8445700" style="top:131px;left:347px;height:30px;">Appointment 11:45am</div> <div class="instance savedNote" id="ide92e3d13-afe8-79d7-bc03-818d4c7a471f" style="top:144px;left:65px;height:80px;">What do you think of a board where you can add writing as much as possible?</div> <div class="instance savedNote" id="idef7fe420-4c19-cfec-36b6-272f1e9b5df5" style="top:301px;left:534px;height:30px;">This was submitted</div> <div class="instance savedNote" id="id93b3b56f-5e23-1bd1-ddc1-9be41f1efb44" style="top:390px;left:217px;height:30px;">Hello world from iPad.</div> </body> So, my question is really: how can I make this work better on iPad? I'm not set on jQuery UI, I'm wondering if this is something I'm doing wrong with jQuery UI, or jQuery, or whether there may be better frameworks for doing cross-platform/backward compatible draggable() elements that will work for touchscreen UIs. More general comments about how to write UI components like this would be welcome as well. Thanks!

    Read the article

  • Android programming - How to acces [to draw on] XML view in main.xml layout, using code

    - by user556248
    Ok I'm a newbie at Android programming, have a hard time with the graphics part. Understand the beauty of creating layout in XML file, but lost how to access various elements, especially a View element to draw on it. See example of my layout main.xml here; <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/root" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content"> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/Title" android:text="App title" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="#000000" android:background="#A0A0FF"/> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/PaperLayout" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1" android:orientation="horizontal" android:focusable="true"> <View android:id="@+id/Paper" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content"> <Button android:id="@+id/File" android:layout_width="fill_parent" android:layout_weight="1" android:layout_height="34dp" android:layout_alignParentTop="true" android:layout_centerInParent="true" android:clickable="true" android:textSize="10sp" android:text="File" /> <Button android:id="@+id/Edit" android:layout_width="fill_parent" android:layout_weight="1" android:layout_height="34dp" android:clickable="true" android:textSize="10sp" android:text="Edit" /> </LinearLayout> </LinearLayout> As you can see I have a custom app title bar, then a View filling middle, and finally two buttons in bottom. Catching button events and responding to, for example changing title bar text and changing View background color works fine, but how the heck do I access and more importantly draw on the view defined in main.xml UPDATE: That for your suggestion, however besides that I need a View, not ImageView and you are missing a parameter on canvas.drawText and an ending bracket, it does not work. Now this is most likely because you missed the fact that I am a newbie and assuming I can fill in any blanks. Now first of all I do NOT understand why in my main.xml layout file I can create a View or even a SurfaceView element, which is what I need, but according to your solution I don't even specify the View like Anyways I edited my main.xml according to your solution, and slimmed it down a bit for simplicity; <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/root" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content"> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/Title" android:text="App title" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="#000000" android:background="#A0A0FF"/> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/PaperLayout" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1" android:orientation="horizontal" android:focusable="true"> <com.example.MyApp.CustomView android:id="@+id/Paper" android:layout_width="fill_parent" android:layout_height="fill_parent" /> <com.example.colorbook.CustomView/> </LinearLayout> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content"> <Button android:id="@+id/File" android:layout_width="fill_parent" android:layout_weight="1" android:layout_height="34dp" android:layout_alignParentTop="true" android:layout_centerInParent="true" android:clickable="true" android:textSize="10sp" android:text="File" /> </LinearLayout> </LinearLayout> In my main java file, MyApp.java, I added this after OnCreate; public class CustomView extends ImageView { @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.drawText("Your Text", 1, 1, null); } } But I get error on the "CustomView" part; "Implicit super constructor ImageView() is undefined for default constructor.Must define an explicit constructor" Eclipse suggests 3 quick fixes about adding constructor, but none helps, well it removes error but gives error on app when running. I hope somebody can break this down for me and provide a solution, and perhaps explain why I can't just create a View element in my main.xml layotu file and draw on it in code.

    Read the article

  • CSS Horizontal sub-menu

    - by Develman
    Hello, I am working on a horizontal CSS dropdown menu. It is still working nearly fine for IE 7, IE 8 , Firefox and Chrome. But I want to make the top <ul> to be on top level (e.g. z-index: 100). I want this because the top level <ul> has a graphical background and the dropdown is just styled with css and in the current way it is destroying the layout. HTML Code: <div id="mainMenu"> <ul> <li><a href="t1">TOP1<!--[if gt IE 6]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul> <li><a href="l1">LINK1</a></li> <li><a href="l2">LINK2</a></li> <li><a href="l3">LINK3</a></li> <li><a href="l4">LINK4</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> <li class="center"><a href="t2">TOP2<!--[if gt IE 6]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td></td></tr></table></a><![endif]--></li> <li><a name="t3">TOP3<!--[if gt IE 6]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]--> <ul class="last"> <li><a href="l5">LINK5</a></li> <li><a href="l6">LINK6</a></li> <li><a href="l7">LINK7</a></li> </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li> </ul> </div> CSS Code /* style the outer div to give it width */ #mainMenu { position: absolute; margin-left: 6px; margin-top: 180px; } /* remove all the bullets, borders and padding from the default list styling */ #mainMenu ul { position: absolute; width: 494px; padding: 0; margin: 0; list-style-type: none; background: #FFF url(../images/mainMenu_bg.gif) no-repeat; } /* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */ #mainMenu li { position: relative; float: left; padding-left: 5px; width: 160px; vertical-align: middle; text-align: left; } #mainMenu li.center { padding-left: 0px; text-align: center; } /* style the links for the top level */ #mainMenu a, #mainMenu a:visited { display: block; font: bold 12px/1em Helvetica, arial, sans-serif; color: #FFF; text-decoration: none; height: 42px; line-height: 35px; } /* hide the sub levels and give them a positon absolute so that they take up no room */ #mainMenu ul ul { visibility: hidden; position: absolute; height: 0; top: 35px; left: -5px; width: 165px; } /* style the table so that it takes no part in the layout - required for IE to work */ #mainMenu table { position: absolute; top: 0; left: 0; } /* style the second level links */ #mainMenu ul ul a, #mainMenu ul ul a:visited { width: 165px; height: 20px; line-height: 19px; font: bold 10px Helvetica, arial, sans-serif; background: #EF7D0E; color: #FFF; text-align: left; padding: 6px 0 0 5px; border-top: 1px solid #C1650B; } #mainMenu ul ul.last a, #mainMenu ul ul.last a:visited { width: 162px; } /* style the top level hover */ #mainMenu a:hover, #mainMenu ul ul a:hover{ color: #FFF; text-decoration: underline; } #mainMenu :hover > a, #mainMenu ul ul :hover > a { color: #FFF; text-decoration: underline; } /* make the second level visible when hover on first level list OR link */ #mainMenu ul li:hover ul, #mainMenu ul a:hover ul{ visibility: visible; } I have still a problem with showing the table in IE 6 but my main problem here is to show the LINK1...6 under the TOP links. I have tried many settings with z-index but nothing worked here. I hope you can help me ;)

    Read the article

  • jQuery: Highlight element under mouse cursor?

    - by Ralph
    I'm trying to create an "element picker" in jQuery, like Firebug has. Basically, I want to highlight the element underneath the user's mouse. Here's what I've got so far, but it isn't working very well: $('*').mouseover(function (event) { var $this = $(this); $div.offset($this.offset()).width($this.width()).height($this.height()); return false; }); var $div = $('<div>') .css({ 'background-color': 'rgba(255,0,0,.5)', 'position': 'absolute', 'z-index': '65535' }) .appendTo('body'); Basically, I'm injecting a div into the DOM that has a semi-transparent background. Then I listen for the mouseover event on every element, then move the div so that it covers that element. Right now, this just makes the whole page go red as soon as you move your mouse over the page. How can I get this to work nicer? Edit: Pretty sure the problem is that as soon as my mouse touches the page, the body gets selected, and then as I move my mouse around, none of the moments get passed through the highligher because its overtop of everything. Firebug Digging through Firebug source code, I found this: drawBoxModel: function(el) { // avoid error when the element is not attached a document if (!el || !el.parentNode) return; var box = Firebug.browser.getElementBox(el); var windowSize = Firebug.browser.getWindowSize(); var scrollPosition = Firebug.browser.getWindowScrollPosition(); // element may be occluded by the chrome, when in frame mode var offsetHeight = Firebug.chrome.type == "frame" ? FirebugChrome.height : 0; // if element box is not inside the viewport, don't draw the box model if (box.top > scrollPosition.top + windowSize.height - offsetHeight || box.left > scrollPosition.left + windowSize.width || scrollPosition.top > box.top + box.height || scrollPosition.left > box.left + box.width ) return; var top = box.top; var left = box.left; var height = box.height; var width = box.width; var margin = Firebug.browser.getMeasurementBox(el, "margin"); var padding = Firebug.browser.getMeasurementBox(el, "padding"); var border = Firebug.browser.getMeasurementBox(el, "border"); boxModelStyle.top = top - margin.top + "px"; boxModelStyle.left = left - margin.left + "px"; boxModelStyle.height = height + margin.top + margin.bottom + "px"; boxModelStyle.width = width + margin.left + margin.right + "px"; boxBorderStyle.top = margin.top + "px"; boxBorderStyle.left = margin.left + "px"; boxBorderStyle.height = height + "px"; boxBorderStyle.width = width + "px"; boxPaddingStyle.top = margin.top + border.top + "px"; boxPaddingStyle.left = margin.left + border.left + "px"; boxPaddingStyle.height = height - border.top - border.bottom + "px"; boxPaddingStyle.width = width - border.left - border.right + "px"; boxContentStyle.top = margin.top + border.top + padding.top + "px"; boxContentStyle.left = margin.left + border.left + padding.left + "px"; boxContentStyle.height = height - border.top - padding.top - padding.bottom - border.bottom + "px"; boxContentStyle.width = width - border.left - padding.left - padding.right - border.right + "px"; if (!boxModelVisible) this.showBoxModel(); }, hideBoxModel: function() { if (!boxModelVisible) return; offlineFragment.appendChild(boxModel); boxModelVisible = false; }, showBoxModel: function() { if (boxModelVisible) return; if (outlineVisible) this.hideOutline(); Firebug.browser.document.getElementsByTagName("body")[0].appendChild(boxModel); boxModelVisible = true; } Looks like they're using a standard div + css to draw it..... just have to figure out how they're handling the events now... (this file is 28K lines long) There's also this snippet, which I guess retrieves the appropriate object.... although I can't figure out how. They're looking for a class "objectLink-element"... and I have no idea what this "repObject" is. onMouseMove: function(event) { var target = event.srcElement || event.target; var object = getAncestorByClass(target, "objectLink-element"); object = object ? object.repObject : null; if(object && instanceOf(object, "Element") && object.nodeType == 1) { if(object != lastHighlightedObject) { Firebug.Inspector.drawBoxModel(object); object = lastHighlightedObject; } } else Firebug.Inspector.hideBoxModel(); }, I'm thinking that maybe when the mousemove or mouseover event fires for the highlighter node I can somehow pass it along instead? Maybe to node it's covering...?

    Read the article

  • "Phased" execution of functions in javascript

    - by FK82
    Hey there! This is my first post on stackoverflow, so please don't flame me too hard if I come across like a total nitwit or if I'm unable ot make myself perfectly clear. :-) Here's my problem: I'm trying to write a javascript function that "ties" two functions to another by checking the first one's completion and then executing the second one. The easy solution to this obviously would be to write a meta function that calls both functions within it's scope. However, if the first function is asynchronous (specifically an AJAX call) and the second function requires the first one's result data, that simply won't work. My idea for a solution was to give the first function a "flag", i.e. making it create a public property "this.trigger" (initialized as "0", set to "1" upon completion) once it is called; doing that should make it possible for another function to check the flag for its value ([0,1]). If the condition is met ("trigger == 1") the second function should get called. The following is an abstract example code that I have used for testing: <script type="text/javascript" > /**/function cllFnc(tgt) { //!! first function this.trigger = 0 ; var trigger = this.trigger ; var _tgt = document.getElementById(tgt) ; //!! changes the color of the target div to signalize the function's execution _tgt.style.background = '#66f' ; alert('Calling! ...') ; setTimeout(function() { //!! in place of an AJAX call, duration 5000ms trigger = 1 ; },5000) ; } /**/function rcvFnc(tgt) { //!! second function that should get called upon the first function's completion var _tgt = document.getElementById(tgt) ; //!! changes color of the target div to signalize the function's execution _tgt.style.background = '#f63' ; alert('... Someone picked up!') ; } /**/function callCheck(obj) { //alert(obj.trigger ) ; //!! correctly returns initial "0" if(obj.trigger == 1) { //!! here's the problem: trigger never receives change from function on success and thus function two never fires alert('trigger is one') ; return true ; } else if(obj.trigger == 0) { return false ; } } /**/function tieExc(fncA,fncB,prms) { if(fncA == 'cllFnc') { var objA = new cllFnc(prms) ; alert(typeof objA + '\n' + objA.trigger) ; //!! returns expected values "object" and "0" } //room for more case definitions var myItv = window.setInterval(function() { document.getElementById(prms).innerHTML = new Date() ; //!! displays date in target div to signalize the interval increments var myCallCheck = new callCheck(objA) ; if( myCallCheck == true ) { if(fncB == 'rcvFnc') { var objB = new rcvFnc(prms) ; } //room for more case definitions window.clearInterval(myItv) ; } else if( myCallCheck == false ) { return ; } },500) ; } </script> The HTML part for testing: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd > <html> <head> <script type="text/javascript" > <!-- see above --> </script> <title> Test page </title> </head> <body> <!-- !! testing area --> <div id='target' style='float:left ; height:6em ; width:8em ; padding:0.1em 0 0 0; font-size:5em ; text-align:center ; font-weight:bold ; color:#eee ; background:#fff;border:0.1em solid #555 ; -webkit-border-radius:0.5em ;' > Test Div </div> <div style="float:left;" > <input type="button" value="tie calls" onmousedown="tieExc('cllFnc','rcvFnc','target') ;" /> </div> <body> </html> I'm pretty sure that this is some issue with javascript scope as I have checked whether the trigger gets set to "1" correctly and it does. Very likely the "checkCall()" function does not receive the updated object but instead only checks its old instance which obviously never flags completion by setting "this.trigger" to "1". If so I don't know how to address that issue. Anyway, hope someone has an idea or experience with this particular kind of problem. Thanks for reading! FK

    Read the article

  • Flash video playing on top of everything else in IE7

    - by Brett
    Hi everyone, I've been spending hours now reading up on IE7's issue with rendering Flash content on top of other elements, particularly navigation menus (this is often a problem with dropdown menus and Flash ad banners, for example). I've tried a few of the suggested solutions but none have worked for me so far. I'll do my best to explain the circumstances, and would appreciate any advice in the matter! Update At Mercator's request, I am providing a large code-sample to assist in any advice you might have. Consider the HTML below: <body> <div id="page-wrap"> <div id="content-wrap"> <div id="main"> <h1>Page Title</h1> <p>Paragraph text before video.</p> <div class="video-container"> <script type="text/javascript"> AC_FL_RunContent('id','player','name','player','width','480','height','294','src','player','allowscriptaccess','always','allowfullscreen','true','flashvars','file=mp4/VIDEO_FILE.mp4','movie','player' ); //end AC code </script> <noscript> <object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" width="480" height="294"> <param name="wmode" value="transparent" /> <param name="movie" value="player.swf" /> <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <param name="flashvars" value="file=mp4/VIDEO_FILE.mp4" /> <embed wmode="transparent" type="application/x-shockwave-flash" id="player2" name="player2" src="player.swf" width="480" height="294" allowscriptaccess="always" allowfullscreen="true" flashvars="file=mp4/VIDEO_FILE.mp4" ></embed> </object> </noscript> </div> <p>Paragraph after video.</p> </div><!-- end main --> <div id="subContent"> <p>Sub-content.</p> </div><!-- end subContent --> <div id="content-clear"></div> </div><!-- end content-wrap --> </div><!-- end page-wrap --> <div id="footpanel"> <ul id="mainpanel"> <li id="panel-link"><a href="#"><span class="icon"></span>Panel Link</a> <div class="subpanel"> <h3><span> &ndash; </span>Panel Link</h3> <ul> <li><p>Revealed content</p></li> </ul> </div> </li> </ul> </div> <!-- END footpanel --> </body> Below are the non-presentational CSS selectors that apply to the divs above: body { /*no positioning styles applied */ } #page-wrap { width: 100%; } #content-wrap { width: 960px; margin 0 auto; } #main { float: left; width: 573px; } .video-container { position: relative; width: 480px; z-index: 1; } #sub { float: left; width: 347px; } #content-clear { clear: both; } #foot-panel { position: fixed; width: 94%; bottom: 0; left: 0; z-index: 3000; } ul#main-panel { float: left; } The footpanel uses jQuery-powered flyout menus, if that provides any further context. These menus have z-indexes in the 300X range to appear above the footpanel. The Flash in question is JW player playing a flash video or mp4. Currently, the object and embed tags are inside a container div. My understanding of previous solutions was that the combination of the param changes and the positioning/z-index change on the container div should have resolved the issue. Alas, it is not so. The player resides on top of the footpanel. Other information that may or may not be helpful is that the page is XHTML 1.0 Transitional and that Dreamweaver reports 1 error in the HTML code: <embed> is not in the XHTML 1.0 specification. This fact does not prevent the video from being viewed in any browser tested, and the page still displays correctly in FF. Thanks in advance!

    Read the article

  • HTML/CSS - Website Help.

    - by gabeaudick
    I'm trying to build my first website from scratch. I mocked up the design in Photoshop, and have been trying to convert into code for a few hours. But I haven't got far. In fact, I'm stuck on the header's navigation bar. It looks right, but it doesn't work. I'm using an unordered-inline list, and trying to link different rectangles in the header. I can't click on anything in the header, though. The code for the html and css files, and a mockup of the header, are below. Any advice on why the header bar isn't working would be much appreciated. Here's a link to the image: http://rookery9.aviary.com.s3.amazonaws.com/3961000/3961027_eb89_625x625.jpg *Ideally, you would be able to click on either "". home.html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <!-- Title --> <title>I am Gabe Audick.</title> <!-- Meta --> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="Author" content="Gabe Audick" /> <meta name="Copyright" content="Gabe Audick" /> <!-- Stylesheets --> <link href="style.css" media="screen" rel="stylesheet" type="text/css" /> <!-- RSS --> <link rel="alternate" type="application/rss+xml" title="gabeaudick RSS" href="http://feeds.feedburner.com/gabeaudick" /> </head> <body> <!-- Navigation Bar --> <div id="wrap"> <div id="header"> <ul> <li><a href="#">Previous</a></li> <li><a href="#">Home</a></li> <li><a href="#">Next</a></li> </ul> </div> </div> <!-- END --> <!-- Google Analytics --> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-5899101-4']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> <!-- End of Google Analytics --> </body> </html> style.css: * { margin: 0; padding: 0; } body { background-color: #fff; color: #000; font-size: 14px; font-family: 'Century Gothic', Helvetica, sans-serif; position: relative; } #wrap { background-color: #000; color: #fbead; height: 26px; width: 100%; } #header { background: url(./images/home.gif) center no-repeat #000; height: 26px; } #header ul li{ float:left; list-style-type:none; margin-right:12px; text-indent:-9999px; } #header li a:link, #header li a:visited{ outline:none; display:block; height:26px; text-indent:-9999px; }

    Read the article

  • jQuery CSS Custom Flyout Menu Styling Issue

    - by aherrick
    I'm close to nailing this flyout menu I have been working on, just have a couple of current pain points. I'm trying to get left/right padding on my submenu items, as you can see I am not quite there. Also when the first submenu is displayed, I want to create a bit of a gap between the first row of list items and the child. Below is my current code and a screen shot displaying what I want. Based on my current CSS, any thoughts on how to get this done in a clean way? <!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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title></title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> function mainmenu() { $("#nav ul").css({ display: "none" }); // Opera Fix $("#nav li").hover(function() { $(this).find('ul:first').css({ visibility: "visible", display: "none" }).show(400); }, function() { $(this).find('ul:first').css({ visibility: "hidden" }); }); } $(document).ready(function() { mainmenu(); }); </script> <style type="text/css"> * { padding: 0px; margin: 0px; } body { font-size: 0.85em; font-family: Verdana, Arial, Helvetica, sans-serif; } #nav, #nav ul { margin: 0; padding: 0; list-style-type: none; list-style-position: outside; position: relative; } #nav a { display: block; padding: 4px 0px 4px 0px; color: #dfca90; text-decoration: none; background-color: #ECE9D8; font-size: 9px; font-weight: bold; font: bold 15px Palatino, 'Palatino Linotype' , Georgia, serif; } #nav > li > a { font-size: 16px; font-variant: small-caps; border-right: 1px solid #dfca90; padding-right: 10px; padding-left: 10px; padding-bottom: 6px; padding-top: 6px; background-color: #fff; color: #dfca90; } #nav li ul li a:hover { color: #999; } #nav li { float: left; position: relative; } #nav ul { position: absolute; display: none; width: 170px; border: 2px solid #dfca90; } #nav ul li { } #nav li ul a { width: 170px; height: auto; float: left; } #nav ul ul { top: -2px; } #nav li ul ul { left: 170px; background-color: #ECE9D8; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul { display: none; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul { display: block; } </style> </head> <body> <ul id="nav"> <li><a href="#">1 HTML</a></li> <li><a href="#">2 CSS</a></li> <li><a href="#">3 Javascript </a> <ul> <li><a href="#">3.1 jQuery</a> <ul> <li><a href="#">3.1.1 Download</a> </li> <li><a href="#">3.1.2 Tutorial</a> </li> </ul> </li> <li><a href="#">3.2 Mootools</a></li> <li><a href="#">3.3 Prototype</a></li> </ul> </li> </ul> </body> </html>

    Read the article

  • Problem with From field in contact form and mail() function

    - by Matthew
    I've got a contact form with 3 fields and a textarea... I use jQuery to validate it and then php to send emails. This contact form works fine but, when I receive an email, From field isn't correct. I'd like to want that From field shows text typed in the Name field of the contact form. Now I get a From field like this: <[email protected]> For example, if an user types "Matthew" in the name field, I'd like to want that this word "Matthew" appears in the From field. This is my code (XHTML, jQuery, PHP): <div id="contact"> <h3 id="formHeader">Send Us a Message!</h3> <form id="contactForm" method="post" action=""> <div id="risposta"></div> <!-- End Risposta Div --> <span>Name:</span> <input type="text" id="formName" value="" /><br /> <span>E-mail:</span> <input type="text" id="formEmail" value="" /><br /> <span>Subject:</span> <input type="text" id="formSubject" value="" /><br /> <span>Message:</span> <textarea id="formMessage" rows="9" cols="20"></textarea><br /> <input type="submit" id="formSend" value="Send" /> </form> </div> <script type="text/javascript"> $(document).ready(function(){ $("#formSend").click(function(){ var valid = ''; var nome = $("#formName").val(); var mail = $("#formEmail").val(); var oggetto = $("#formSubject").val(); var messaggio = $("#formMessage").val(); if (nome.length<1) { valid += '<span>Name field empty.</span><br />'; } if (!mail.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) { valid += '<span>Email not valid or empty field.</span><br />'; } if (oggetto.length<1) { valid += '<span>Subject field empty.</span><br />'; } if (valid!='') { $("#risposta").fadeIn("slow"); $("#risposta").html("<span><b>Error:</b></span><br />"+valid); $("#risposta").css("background-color","#ffc0c0"); } else { var datastr ='nome=' + nome + '&mail=' + mail + '&oggetto=' + oggetto + '&messaggio=' + encodeURIComponent(messaggio); $("#risposta").css("display", "block"); $("#risposta").css("background-color","#FFFFA0"); $("#risposta").html("<span>Sending message...</span>"); $("#risposta").fadeIn("slow"); setTimeout("send('"+datastr+"')",2000); } return false; }); }); function send(datastr){ $.ajax({ type: "POST", url: "contactForm.php", data: datastr, cache: false, success: function(html) { $("#risposta").fadeIn("slow"); $("#risposta").html('<span>Message successfully sent.</span>'); $("#risposta").css("background-color","#e1ffc0"); setTimeout('$("#risposta").fadeOut("slow")',2000); } }); } </script> <?php $mail = $_POST['mail']; $nome = $_POST['nome']; $oggetto = $_POST['oggetto']; $text = $_POST['messaggio']; $ip = $_SERVER['REMOTE_ADDR']; $to = "[email protected]"; $message = $text."<br /><br />IP: ".$ip."<br />"; $headers = "From: $nome \n"; $headers .= "Reply-To: $mail \n"; $headers .= "MIME-Version: 1.0 \n"; $headers .= "Content-Type: text/html; charset=UTF-8 \n"; mail($to, $oggetto, $message, $headers); ?>

    Read the article

  • Vertical Scroll not working, are the guides but the screen does not scroll.

    - by Leandro
    package com.lcardenas.infoberry; import net.rim.device.api.system.DeviceInfo; import net.rim.device.api.system.GPRSInfo; import net.rim.device.api.system.Memory; import net.rim.device.api.ui.MenuItem; import net.rim.device.api.ui.component.Dialog; import net.rim.device.api.ui.component.LabelField; import net.rim.device.api.ui.component.Menu; import net.rim.device.api.ui.component.SeparatorField; import net.rim.device.api.ui.container.MainScreen; import net.rim.device.api.ui.container.VerticalFieldManager; import net.rim.device.api.ui.decor.Background; import net.rim.device.api.ui.decor.BackgroundFactory; public class vtnprincipal extends MainScreen { //llamamos a la clase principal private InfoBerry padre; //variables para el menu private MenuItem mnubateria; private MenuItem mnuestado; private MenuItem mnuacerca; public vtnprincipal(InfoBerry padre) { super(); this.padre = padre; } public void incventana(){ VerticalFieldManager _ventana = new VerticalFieldManager(VerticalFieldManager.VERTICAL_SCROLL | VerticalFieldManager.VERTICAL_SCROLLBAR); double tmemoria =((DeviceInfo.getTotalFlashSize()/1024)/1024.00); double fmemoria = ((Memory.getFlashFree()/1024)/1024.00); Background cyan = BackgroundFactory.createSolidBackground(0x00E0FFFF); Background gris = BackgroundFactory.createSolidBackground(0x00DCDCDC ); //Borramos todos de la pantalla this.deleteAll(); //llamamos al menu incMenu(); //DIBUJAMOS LA VENTANA try{ LabelField title = new LabelField("Info Berry", LabelField.FIELD_HCENTER | LabelField.USE_ALL_HEIGHT ); setTitle(title); _ventana.add(new LabelField("Información del Dispositivo", LabelField.FIELD_HCENTER |LabelField.RIGHT | LabelField.USE_ALL_HEIGHT | LabelField.NON_FOCUSABLE )); _ventana.add(new SeparatorField()); _ventana.add(new SeparatorField()); txthorizontal modelo = new txthorizontal("Modelo:", DeviceInfo.getDeviceName()); modelo.setBackground(gris); _ventana.add(modelo); txthorizontal pin = new txthorizontal("PIN:" , Integer.toHexString(DeviceInfo.getDeviceId()).toUpperCase()); pin.setBackground(cyan); _ventana.add(pin); txthorizontal imeid = new txthorizontal("IMEID:" , GPRSInfo.imeiToString(GPRSInfo.getIMEI())); imeid.setBackground(gris); _ventana.add(imeid); txthorizontal version= new txthorizontal("SO Versión:" , DeviceInfo.getSoftwareVersion()); version.setBackground(cyan); _ventana.add(version); txthorizontal plataforma= new txthorizontal("SO Plataforma:" , DeviceInfo.getPlatformVersion()); plataforma.setBackground(gris); _ventana.add(plataforma); txthorizontal numero= new txthorizontal("Numero Telefonico: " , "Hay que firmar"); numero.setBackground(cyan); _ventana.add(numero); _ventana.add(new SeparatorField()); _ventana.add(new SeparatorField()); _ventana.add(new LabelField("Memoria", LabelField.FIELD_HCENTER | LabelField.USE_ALL_HEIGHT | LabelField.NON_FOCUSABLE)); _ventana.add(new SeparatorField()); txthorizontal totalm= new txthorizontal("Memoria app Total:" , mmemoria(tmemoria) + " Mb"); totalm.setBackground(gris); _ventana.add(totalm); txthorizontal disponiblem= new txthorizontal("Memoria app Disponible:" , mmemoria(fmemoria) + " Mb"); disponiblem.setBackground(cyan); _ventana.add(disponiblem); ///txthorizontal estadoram = new txthorizontal("Memoria RAM:" , mmemoria(prueba) + " Mb"); //estadoram.setBackground(gris); //add(estadoram); _ventana.add(new SeparatorField()); _ventana.add(new SeparatorField()); this.add(_ventana); }catch(Exception e){ Dialog.alert("Excepción en clase vtnprincipal: " + e.toString()); } } //DIBUJAMOS EL MENU private void incMenu() { MenuItem.separator(30); mnubateria = new MenuItem("Bateria",40, 10) { public void run() { bateria(); } }; mnuestado = new MenuItem("Estado de Red", 50, 10) { public void run() { estado(); } }; mnuacerca = new MenuItem("Acerca de..", 60, 10) { public void run() { acerca(); } }; MenuItem.separator(70); }; // public void makeMenu(Menu menu, int instance) { if (!menu.isDisplayed()) { menu.deleteAll(); menu.add(MenuItem.separator(30)); menu.add(mnubateria); menu.add(mnuestado); menu.add(mnuacerca); menu.add(MenuItem.separator(60)); } } public void bateria(){ padre.vtnbateria.incventana(); padre.pushScreen(padre.vtnbateria); } public void estado(){ padre.vtnestado.incventana(); padre.pushScreen(padre.vtnestado); } public void acerca(){ padre.vtnacerca.incventana(); padre.pushScreen(padre.vtnacerca); } public boolean onClose(){ Dialog.alert("Hasta Luego"); System.exit(0); return true; } public double mmemoria(double x) { if ( x > 0 ) return Math.floor(x * 100) / 100; else return Math.ceil(x * 100) / 100; } }

    Read the article

  • MSDN "pseudoframe"

    - by bobobobo
    So, I'm trying to replicate MSDN "pseudoframes" here. Their pages are laid out like they're using an old-school frameset, but inspecting their elements with firebug reveals they've done this with purely div's. Here's my attempt at it. Its not perfect though, it only works in Chrome and Firefox, it has this weird highlight select behavior that I don't like, any takers? <!doctype html> <html> <head> <title>msdn "pseudoframe"</title> <style> body { background-color: #aaa; margin: 0; padding: 0; } div#pseudoframe, div#main { border: solid 1px black; background-color: #fff; } div#pseudoframe { position: absolute; left: 0; width: 180px; height: 100%; overflow-x: auto; overflow-y: none; } div#sizeMod { background-color: #a0a; position: absolute; left: 220px; height: 100%; cursor: e-resize; } div#main { font-weight: bold; font-size: 2em; padding: 24px; margin-left: 224px; } </style> <script type="text/javascript"> function initialize() { // get the pseudoframe and attach an event to the mouse flyover. var pf = document.getElementById('pseudoframe'); var main = document.getElementById('main'); var resize = document.getElementById( 'sizeMod' ); pf['onmouseover'] = function( event ) { event = event || window.event; var el = event.srcElement || event.target ; // are we within 5 px of the border? if we are, // change the mouse cursor to resize. }; pf['onscroll'] = function( event ) { event = event || window.event; var el = event.srcElement || event.target ; var sizeMod = document.getElementById( 'sizeMod' ); //alert( el.scrollLeft ); sizeMod.style.right = '-' + (el.scrollLeft) + 'px'; //alert( sizeMod.style.right ); // are we within 5 px of the border? if we are, // change the mouse cursor to resize. }; resize['onmousedown'] = function( event ) { event = event || window.event; var el = event.srcElement || event.target ; window.lockResize = true; }; window['onmouseup'] = function( event ) { event = event || window.event; var el = event.srcElement || event.target ; window.lockResize = false; //release on any mouse up event //alert('unlocked'); }; window['onmousemove'] = function( event ) { event = event || window.event; var el = event.srcElement || event.target ; if( window.lockResize == true ) { // resize. get client x and y. var x = event.clientX; var y = event.clientY; pf.style.width = x + 'px'; resize.style.left = x + 'px'; main.style.marginLeft = x + 'px'; //alert( pf.style.width ); event.stopPropagation(); event.preventDefault(); return false; } }; } </script> </head> <body onload=" initialize(); "> <div id="pseudoframe"> <ul> <li>Code</li> <li>MICROSOFT CODE <ul> <li>WINDOWS XP SOURCE</li> <li>WINDOWS VISTA SOURCE</li> <li>WINDOWS 7 SOURCE</li> <li>WINDOWS 8 SOURCE</li> </ul> </li> <li>DOWNLOAD ALL MICROSOFT CODE EVER WRITTEN</li> <li>DOWNLOAD ALL MAC OS CODE EVER WRITTEN</li> <li>DOWNLOAD ALL AMIGA GAME CONSOLE CODE</li> <li>DOWNLOAD ALL CODE EVER WRITTEN PERIOD</li> </ul> </div> <div id="sizeMod">&nbsp;&nbsp;</div> <div id="main"> lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe lorem ipsum microsoft pseudoframe </div> </body> </html>

    Read the article

  • IE6 + IE7 CSS problem with overflow: hidden; - position: relative; combo.

    - by googletorp
    So I have created a slider for a homepage, that slides some images with a title and teaser text using jQuery. Everything works fine, and I went to check IE and found that IE 6 and 7 kills my slider css completely. I can't figure out why, but for some reason I can't hide the non active slides with overflow: hidden; I've tried tweaking the css back and forth, but haven't been able to figure out what's causing the problem. I've recreated the problem in a more isolated html page. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da" lang="da" dir="ltr"> <head> <style> body { width: 900px; } .column-1 { width: 500px; float: left; } .column-2 { width: 200px; float: left; } .column-3 { width: 200px; float: left; } ul { width: 2000px; left: -499px; position: relative; } li { list-style: none; display: block; float: left; } .item-list { overflow: hidden; width: 499px; } </style> </head> <body> <div class="column-1"> <div class="item-list clearfix"> <ul> <li class="first"> <div class="node-slide"> <img src="http://www.hanselman.com/blog/content/binary/lolcats-funny-pictures-leroy-jenkins.jpg" /> <div class="infobox"> <h4>Title 1</h4> <p>Teaser 1</p> </div> </div> </li> <li> <div class="slide"> <img src="http://www.hanselman.com/blog/content/binary/lolcats-funny-pictures-leroy-jenkins.jpg" /> <div class="infobox"> <h4>Title 2</h4> <p>Teaser 2</p> </div> </div> </li> <li class="last"> <div class="slide"> <img src="http://www.hanselman.com/blog/content/binary/lolcats-funny-pictures-leroy-jenkins.jpg" /> <div class="infobox"> <h4>Title 3</h4> <p>Teaser 3</p> </div> </div> </li> </ul> </div> </div> <div class="column-2"> ... </div> <div class="column-3"> ... </div> </body> </html> I've tracked down that it is the ul { position: relative; } on the ul element that is causing the overflow: hidden not to work, but why that is, I don't know. Also this is needed to make the slider javascript work using the left attribute on the ul to slide it. Any ideas as to how you can fix this is most welcome.

    Read the article

  • IE7 li ul bug on dropdown menu

    - by Berns
    hoping one of you guys can help me please. I have a basic list menu with two dropdowns. This all works fine on all browsers except IE6 and IE7. Please take a look at my markup. <nav> <ul id="topNav" ><li id="topNavFirst"><a href="../about/about.php" id="aboutNav">About Us</a></li ><li id="topNavSecond"><a href="../people/our-people.php" id="peopleNav">Our People</a ><ul id="subList1"><li><a href="../people/mike-hadfield.php">Mike Hadfield</a></li ><li><a href="../people/karen-sampson.php">Karen Sampson</a></li ><li><a href="../people/milhana-farook.php">Milhana Farook</a></li ><li><a href="../people/kim-crook.php">Kim Crook</a></li ><li><a href="../people/amanda-lynch.php">Amanda Lynch</a></li ><li><a href="../people/gideon-scott.php">Gideon Scott</a></li ><li><a href="../people/paul-fuller.php">Paul Fuller</a></li ><li><a href="../people/peter-chaplain.php">Peter Chaplain</a></li ><li><a href="../people/laura-hutley.php">Laura Hutley</a></li ></ul ></li ><li id="topNavThird"><a href="../services/our-services.php" id="servicesNav">Our Services</a ><ul id="subList2"><li><a href="../services/company-and-commercial.php">Company &amp; Commercial</a></li ><li><a href="../services/employment.php">Employment</a></li ><li><a href="../services/civil-litigation.php">Civil Litigation</a></li ><li><a href="../services/debt-recovery.php">Debt Recovery</a></li ><li><a href="../services/conveyancing.php">Conveyancing</a></li ><li><a href="../services/commercial-property.php">Commerical Property</a></li ><li><a href="../services/wills-and-probate.php">Wills &amp; Probate</a></li ><li><a href="../services/family.php">Matrimonial &amp; Family</a></li ></ul ></li ><li><a href="../news/news.php" id="newsNav">News</a></li ><li><a href="../careers/careers.php" id="careersNav">Careers</a></li ><li><a href="../contact/contact.php" id="contactNav">Contact</a></li ></ul><!-- /topNav --> </nav>? and the css a {text-decoration:none;} #topNav { float:right; height:30px; margin:0; font-size:12px; } #topNav li { display:inline; float:left; list-style:none; color:#666; border-left: 1px solid #666; padding: 0 3px 0 3px; position:relative; } #topNav ul a { white-space:nowrap; } #topNav li a:hover { border-bottom:2px solid #369; } #topNavSecond a:hover { border-bottom:2px solid transparent !important; } #topNavFirst { border-left: 1px solid transparent !important; } /*****OUR-PEOPLE DROPDOWN*****/ #topNav ul{ background:#fff; border:1px solid #666; border-top:0px solid transparent; border-bottom:2px solid #666; list-style:none; position:absolute; left:-9999px; width:100px; text-align:left; padding:5px 0 5px 0px; margin:0 0 0 -4px; z-index:10; -webkit-box-shadow: 1px 1px 1px #666; -moz-box-shadow: 1px 1px 1px #666; box-shadow: 1px 1px 1px #666; vertical-align: bottom; } #topNav ul li{ display:block; border-left:0px; margin-bottom: 0px; padding:0; vertical-align: bottom; } #topNav ul a{ padding:0 0 0 5px; } #topNav li:hover ul{ left:auto; } #topNav li:hover a { color:#369; } #topNav li:hover ul a{ text-decoration:none; color:#666; } #topNav li:hover ul li a:hover{ color:#fff;; width:100%; border-bottom:0px solid transparent !important; } #topNav ul li:hover { background:#369; display: block; } #topNav ul li a { display: block; padding:0 0 0 4px; } /************/ /*****OUR-SERVICES DROPDOWN*****/ #topNavThird a:hover { border-bottom:2px solid transparent !important; } #topNavThird ul{ /*background:#fff url(images/service-ul-bg.png) no-repeat;*/ width:135px !important; /*margin-left:120px !important;*/ }? here it is working perfectly http://jsfiddle.net/BcWd9/ here is a screen shot of how it looks in IE7. hadfield.andymcnallydesign.co.uk/images/ie7-error.jpg as you can see the ul is appearing to the right of the li and not the left and it is overlaying the top list. I've tried removing white space, but no luck. Any ideas? If one of you can help it would be much appreciated.

    Read the article

  • What does Ruby have that Python doesn't, and vice versa?

    - by Lennart Regebro
    There is a lot of discussions of Python vs Ruby, and I all find them completely unhelpful, because they all turn around why feature X sucks in language Y, or that claim language Y doesn't have X, although in fact it does. I also know exactly why I prefer Python, but that's also subjective, and wouldn't help anybody choosing, as they might not have the same tastes in development as I do. It would therefore be interesting to list the differences, objectively. So no "Python's lambdas sucks". Instead explain what Ruby's lambdas can do that Python's can't. No subjectivity. Example code is good! Don't have several differences in one answer, please. And vote up the ones you know are correct, and down those you know are incorrect (or are subjective). Also, differences in syntax is not interesting. We know Python does with indentation what Ruby does with brackets and ends, and that @ is called self in Python. UPDATE: This is now a community wiki, so we can add the big differences here. Ruby has a class reference in the class body In Ruby you have a reference to the class (self) already in the class body. In Python you don't have a reference to the class until after the class construction is finished. An example: class Kaka puts self end self in this case is the class, and this code would print out "Kaka". There is no way to print out the class name or in other ways access the class from the class definition body in Python. All classes are mutable in Ruby This lets you develop extensions to core classes. Here's an example of a rails extension: class String def starts_with?(other) head = self[0, other.length] head == other end end Ruby has Perl-like scripting features Ruby has first class regexps, $-variables, the awk/perl line by line input loop and other features that make it more suited to writing small shell scripts that munge text files or act as glue code for other programs. Ruby has first class continuations Thanks to the callcc statement. In Python you can create continuations by various techniques, but there is no support built in to the language. Ruby has blocks With the "do" statement you can create a multi-line anonymous function in Ruby, which will be passed in as an argument into the method in front of do, and called from there. In Python you would instead do this either by passing a method or with generators. Ruby: amethod { |here| many=lines+of+code goes(here) } Python: def function(here): many=lines+of+code goes(here) amethod(function) Interestingly, the convenience statement in Ruby for calling a block is called "yield", which in Python will create a generator. Ruby: def themethod yield 5 end themethod do |foo| puts foo end Python: def themethod(): yield 5 for foo in themethod: print foo Although the principles are different, the result is strikingly similar. Python has built-in generators (which are used like Ruby blocks, as noted above) Python has support for generators in the language. In Ruby you could use the generator module that uses continuations to create a generator from a block. Or, you could just use a block/proc/lambda! Moreover, in Ruby 1.9 Fibers are, and can be used as, generators. docs.python.org has this generator example: def reverse(data): for index in range(len(data)-1, -1, -1): yield data[index] Contrast this with the above block examples. Python has flexible name space handling In Ruby, when you import a file with require, all the things defined in that file will end up in your global namespace. This causes namespace pollution. The solution to that is Rubys modules. But if you create a namespace with a module, then you have to use that namespace to access the contained classes. In Python, the file is a module, and you can import its contained names with from themodule import *, thereby polluting the namespace if you want. But you can also import just selected names with from themodule import aname, another or you can simply import themodule and then access the names with themodule.aname. If you want more levels in your namespace you can have packages, which are directories with modules and an __init__.py file. Python has docstrings Docstrings are strings that are attached to modules, functions and methods and can be introspected at runtime. This helps for creating such things as the help command and automatic documentation. def frobnicate(bar): """frobnicate takes a bar and frobnicates it >>> bar = Bar() >>> bar.is_frobnicated() False >>> frobnicate(bar) >>> bar.is_frobnicated() True """ Python has more libraries Python has a vast amount of available modules and bindings for libraries. Python has multiple inheritance Ruby does not ("on purpose" -- see Ruby's website, see here how it's done in Ruby). It does reuse the module concept as a sort of abstract classes. Python has list/dict comprehensions Python: res = [x*x for x in range(1, 10)] Ruby: res = (0..9).map { |x| x * x } Python: >>> (x*x for x in range(10)) <generator object <genexpr> at 0xb7c1ccd4> >>> list(_) [0, 1, 4, 9, 16, 25, 36, 49, 64, 81] Ruby: p = proc { |x| x * x } (0..9).map(&p) Python: >>> {x:str(y*y) for x,y in {1:2, 3:4}.items()} {1: '4', 3: '16'} Ruby: >> Hash[{1=>2, 3=>4}.map{|x,y| [x,(y*y).to_s]}] => {1=>"4", 3=>"16"} Python has decorators Things similar to decorators can be created in Ruby, and it can also be argued that they aren't as necessary as in Python.

    Read the article

  • Having trouble on mouse over tabs

    - by user225269
    I downloaded a webpage template from the internet because I don't know how to design webpage on photoshop. This was the one I downloaded: http://www.freewebtemplates.com/download/templates/9839 And modified it. And I have this code for mouse over tabs from dynamic drive. But doesn't seem to be working with the template that I downloaded. Here is my current code: <script src="mouseovertabs.js" type="text/javascript"> </script> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Designed by Web Page Templates</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <link href="default.css" rel="stylesheet" type="text/css" /> </head> <body> <table border="0" align="center" cellpadding="0" cellspacing="0" class="bg1"> <tr> <td class="text1" style="height: 50px;">xd627 information management system</td> </tr> <tr> <div id="mytabsmenu" class="tabsmenuclass"> <td class="bg5"><table border="0" cellspacing="0" cellpadding="0" style="height: 62px; padding-top: 15px;"> <tr align="center"> <td><ul><li><a href="index.html" class="link1">Homepage</a></li></td> <td><li><a href="RegStuds.php" class="link1">Database</a></li></td> <td><li><a href="#" class="link1">About</a></li> </ul></td> <a href="submenucontents.htm" style="visibility:hidden">Sub Menu contents</a> <div id="mysubmenuarea" class="tabsmenucontentclass"> <!--1st link within submenu container should point to the external submenu contents file--> <a href="submenucontents.htm" style="visibility:hidden">Sub Menu contents</a> </div> <script type="text/javascript"> //mouseovertabsmenu.init("tabs_container_id", "submenu_container_id", "bool_hidecontentsmouseout") mouseovertabsmenu.init("mytabsmenu", "mysubmenuarea", true) </script> </div> What might be wrong here,its working perfectly with my previous one, but with no layout at all: <script src="mouseovertabs.js" type="text/javascript"> /*********************************************** * Mouseover Tabs Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more ***********************************************/ </script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <div id="mytabsmenu" class="tabsmenuclass"> <ul> <li><a href="" rel="gotsubmenu[selected]">Database Manipulation</a></li> <li><a href="" rel="gotsubmenu" >Register User</a></li> <li><a href="loginform2.php" rel="gotsubmenu" >Logout</a></li> <li><a href=""></a></li> </ul> </div> <div id="mysubmenuarea" class="tabsmenucontentclass"> <!--1st link within submenu container should point to the external submenu contents file--> <a href="submenucontents.htm" style="visibility:hidden">Sub Menu contents</a> </div> <script type="text/javascript"> //mouseovertabsmenu.init("tabs_container_id", "submenu_container_id", "bool_hidecontentsmouseout") mouseovertabsmenu.init("mytabsmenu", "mysubmenuarea", true) </script> </body> </html>

    Read the article

  • Fix a box 250px from top of content with wrapping content

    - by Matt
    I'm having trouble left aligning a related links div inside a block of text, exactly 250 pixels from the top of a content area, while retaining word wrapping. I attempted to do this with absolute positioning, but the text in the content area doesn't wrap around the content. I would just fix the related links div in the content, however, this will display on an article page, so I would like for it to be done without placing it in a specific location in the content. Is this possible? If so, can someone help me out with the CSS for this? Example image of desired look & feel... UPDATE: For simplicity, I've added example code. You can view this here: http://www.focusontheclouds.com/files/example.html. Example HTML: <!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> <title>Example Page</title> <style> body { width: 400px; font-family: Arial, sans-serif; } h1 { font-family: Georgia, serif; font-weight: normal; } .relatedLinks { position: relative; width: 150px; text-align: center; background: #f00; height: 300px; float: left; margin: 0 10px 10px 0; } </style> </head> <body> <div class="relatedLinks"><h1>Related Links</h1></div> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc tempus est luctus ante auctor et ullamcorper metus ullamcorper. Vestibulum molestie, lectus sed luctus egestas, dolor ipsum aliquet orci, ac bibendum quam elit blandit nulla.</p> <p>In sit amet sagittis urna. In fermentum enim et lectus consequat a congue elit porta. Pellentesque nisl quam, elementum vitae elementum et, facilisis quis velit. Nam odio neque, viverra in consectetur at, mollis eu mi. Etiam tempor odio vitae ligula ultrices mollis. </p> <p>Donec eget ligula id augue pulvinar lobortis. Mauris tincidunt suscipit felis, eget eleifend lectus molestie in. Donec et massa arcu. Aenean eleifend nulla at odio adipiscing quis interdum arcu dictum. Fusce tellus dolor, tempor ut blandit a, dapibus ac ante. Nulla eget ligula at turpis consequat accumsan egestas nec purus. Nullam sit amet turpis ac lacus tincidunt hendrerit. Nulla iaculis mauris sed enim ornare molestie. </p> <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas non purus diam. Suspendisse iaculis tincidunt tempor. Suspendisse ut pretium lectus. Maecenas id est dui.</p> <p>Nunc pretium ipsum id libero rhoncus varius. Duis imperdiet elit ut turpis porta pharetra. Nulla vel dui vitae ipsum sollicitudin varius. Duis sagittis elit felis, quis interdum odio. </p> <p>Morbi imperdiet volutpat sodales. Aenean non euismod est. Cras ultricies felis non tortor congue ultrices. Proin quis enim arcu. Cras mattis sagittis erat, elementum bibendum ipsum imperdiet eu. Morbi fringilla ullamcorper elementum. Vestibulum semper dui non elit luctus quis accumsan ante scelerisque.</p> </body> </html>

    Read the article

  • navbar hover issue in ie7

    - by Joel
    I'm having a problem with a child list not hovering correctly in IE7. Other browsers and IE7 seem to work fine. Here is the site: http://rattletree.com/index_1.php If you hover over the nav bars you'll see the sub-list come into view. You can see that the arrow image is not below the navbar in IE7 only. html: <div id="navbar2"> <ul id="navbar"> <li id="index"><a href="index.php">About Rattletree</a></li> <li id="upcomingshows"><a href="upcomingshows.php">Calendar</a></li> <li id="booking"><a href="booking.php">Contact</a> <ul class="innerlist"> <li class="innerlist"><img class="arrowAdjust" src="images/curved_arrow.png"</img><a href="#">Booking Information</a></li> <li class="innerlist"><a href="#">Press</a></li> </ul> </li> <li id="instruments"><a href="instruments.php">The Band</a> <ul class="innerlist"> <li class="innerlist"><img class="arrowAdjust" src="images/curved_arrow.png"</img><a href="#">The Instruments</a></li> <li class="innerlist"><a href="#">The Players</a></li> </ul> </li> <li id="classes"><a href="classes.php">Sights &amp; Sounds</a> <ul class="innerlist"> <li class="innerlist"><img class="arrowAdjust" src="images/curved_arrow.png"</img><a href="#">Listen</a></li> <li class="innerlist"><a href="#">Photos</a></li> <li class="innerlist"><a href="#">Video</a></li> </ul> </li> <li id"classes"><a href="classes.php">Workshops &amp; Classes</a></li> </ul> </div> and css: /* OUTER LIST STYLING */ div#navbar2 { position:relative; width: 100%; border-top: solid #000 1px; border-bottom: solid #546F8B 1px; background-color: #546F8B; } div#navbar2 ul#navbar { padding: 0px; margin: 10px 0; font-family: Arial, Helvetica, sans-serif; font-size: 16px; letter-spacing:1px; color: #FFF; white-space: nowrap; display:block; } div#navbar2 ul#navbar li { position:relative; margin: 0px; padding:0px; list-style-type: none; display:inline; } div#navbar2 li a { text-decoration: none; color: #fff; margin:0; padding: 11px 12px; } div#navbar2 li a:link { color: #FFF: } div#navbar2 li a:visited { color: #ffffff; } div#navbar2 li a:hover { color: #000; background-color: #FDFFC9; } /* INNER LIST STYLING */ div#navbar2 ul#navbar li ul.innerlist{ display: none; color:#000; } div#navbar2 ul#navbar li ul.innerlist li{ color:#000; } div#navbar2 ul#navbar li:hover ul.innerlist { position: absolute; display: inline; left: 0; width: 100%; margin: 30px 0 0px 0px; padding: 0; color:#000; } div#navbar2 ul#navbar li.innerlist a { text-decoration: none; font-weight:bold; color: #000; padding: 10px 15px 20px 15px; margin:0; } div#navbar2 li.innerlist a:link { color: #000: } div#navbar2 li.innerlist a:visited { color: #000; } div#navbar2 ul#navbar li.innerlist a:hover { color: #e62d31; background-color:transparent; } img.arrowAdjust{ padding:0px 0 0 20px; margin:0; }

    Read the article

  • How to embed a progressbar into a HTML form?

    - by Noah Brainey
    I have this code below and want it to show the progress of a form submission of a file upload. I want it to work on my website visit it through this IP (24.148.156.217). So if you saw the website I want the progress bar to be displayed when the user fills in the information and then hits the submit button. Then the progress bar displays with the time until it's finished. <style> <!-- .hide { position:absolute; visibility:hidden; } .show { position:absolute; visibility:visible; } --> </style> <SCRIPT LANGUAGE="JavaScript"> //Progress Bar script- by Todd King ([email protected]) //Modified by JavaScript Kit for NS6, ability to specify duration //Visit JavaScript Kit (http://javascriptkit.com) for script var duration=3 // Specify duration of progress bar in seconds var _progressWidth = 50; // Display width of progress bar. var _progressBar = "|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||" var _progressEnd = 5; var _progressAt = 0; // Create and display the progress dialog. // end: The number of steps to completion function ProgressCreate(end) { // Initialize state variables _progressEnd = end; _progressAt = 0; // Move layer to center of window to show if (document.all) { // Internet Explorer progress.className = 'show'; progress.style.left = (document.body.clientWidth/2) - (progress.offsetWidth/2); progress.style.top = document.body.scrollTop+(document.body.clientHeight/2) - (progress.offsetHeight/2); } else if (document.layers) { // Netscape document.progress.visibility = true; document.progress.left = (window.innerWidth/2) - 100+"px"; document.progress.top = pageYOffset+(window.innerHeight/2) - 40+"px"; } else if (document.getElementById) { // Netscape 6+ document.getElementById("progress").className = 'show'; document.getElementById("progress").style.left = (window.innerWidth/2)- 100+"px"; document.getElementById("progress").style.top = pageYOffset+(window.innerHeight/2) - 40+"px"; } ProgressUpdate(); // Initialize bar } // Hide the progress layer function ProgressDestroy() { // Move off screen to hide if (document.all) { // Internet Explorer progress.className = 'hide'; } else if (document.layers) { // Netscape document.progress.visibility = false; } else if (document.getElementById) { // Netscape 6+ document.getElementById("progress").className = 'hide'; } } // Increment the progress dialog one step function ProgressStepIt() { _progressAt++; if(_progressAt > _progressEnd) _progressAt = _progressAt % _progressEnd; ProgressUpdate(); } // Update the progress dialog with the current state function ProgressUpdate() { var n = (_progressWidth / _progressEnd) * _progressAt; if (document.all) { // Internet Explorer var bar = dialog.bar; } else if (document.layers) { // Netscape var bar = document.layers["progress"].document.forms["dialog"].bar; n = n * 0.55; // characters are larger } else if (document.getElementById){ var bar=document.getElementById("bar") } var temp = _progressBar.substring(0, n); bar.value = temp; } // Demonstrate a use of the progress dialog. function Demo() { ProgressCreate(10); window.setTimeout("Click()", 100); } function Click() { if(_progressAt >= _progressEnd) { ProgressDestroy(); return; } ProgressStepIt(); window.setTimeout("Click()", (duration-1)*1000/10); } function CallJS(jsStr) { //v2.0 return eval(jsStr) } </script> <SCRIPT LANGUAGE="JavaScript"> // Create layer for progress dialog document.write("<span id=\"progress\" class=\"hide\">"); document.write("<FORM name=dialog id=dialog>"); document.write("<TABLE border=2 bgcolor=\"#FFFFCC\">"); document.write("<TR><TD ALIGN=\"center\">"); document.write("Progress<BR>"); document.write("<input type=text name=\"bar\" id=\"bar\" size=\"" + _progressWidth/2 + "\""); if(document.all||document.getElementById) // Microsoft, NS6 document.write(" bar.style=\"color:navy;\">"); else // Netscape document.write(">"); document.write("</TD></TR>"); document.write("</TABLE>"); document.write("</FORM>"); document.write("</span>"); ProgressDestroy(); // Hides </script> <form name="form1" method="post"> <center> <input type="button" name="Demo" value="Display progress" onClick="CallJS('Demo()')"> </center> </form> <a href="javascript:CallJS('Demo()')">Text link example</a>

    Read the article

  • click buttons error

    - by sara
    I will retrieve student information (id -number- name) from a database (MySQL) as a list view, each student have 2 buttons (delete - alert ) and radio buttons Every thing is ok, but how can I make an onClickListener, for example for the delete button because I try lots of examples, I heard that I can use (custom list or get view or direct onClickListener as in my code (but it is not working ) or Simple Cursor Adapter) I do not know what to use, I looked around for examples that can help me, but in my case but I did not find any so I hope this be reference for anyone have the same problem. this is my code which I use direct onClick with Simple Adapter public class ManageSection extends ListActivity { //ProgresogressDialog pDialog; private ProgressDialog pDialog; // Creating JSON Parser object // Creating JSON Parser object JSONParser jParser = new JSONParser(); //class boolean x =true; Button delete; ArrayList<HashMap<String, String>> studentList; //url to get all products list private static String url_all_student = "http://10.0.2.2/SmsPhp/view_student_info.php"; String cl; // JSON Node names private static final String TAG_SUCCESS = "success"; private static final String TAG_student = "student"; private static final String TAG_StudentID = "StudentID"; private static final String TAG_StudentNo = "StudentNo"; private static final String TAG_FullName = "FullName"; private static final String TAG_Avatar="Avatar"; HashMap<String, String> selected_student; // course JSONArray JSONArray student = null; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.manage_section); studentList = new ArrayList<HashMap<String, String>>(); ListView list1 = getListView(); list1.setAdapter(getListAdapter()); list1.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int pos, long l) { selected_student =(HashMap<String, String>) studentList.get(pos); //member of your activity. delete =(Button)view.findViewById(R.id.DeleteStudent); cl=selected_student.get(TAG_StudentID); Toast.makeText(getBaseContext(),cl,Toast.LENGTH_LONG).show(); delete.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { Log.d("id: ",cl); Toast.makeText(getBaseContext(),cl,Toast.LENGTH_LONG).show(); } }); } }); new LoadAllstudent().execute(); } /** * Background Async Task to Load all student by making HTTP Request * */ class LoadAllstudent extends AsyncTask<String, String, String> { /** * Before starting background thread Show Progress Dialog * */ @Override protected void onPreExecute() { super.onPreExecute(); pDialog = new ProgressDialog(ManageSection.this); pDialog.setMessage("Loading student. Please wait..."); pDialog.setIndeterminate(false); } /** * getting All student from u r l * */ @Override protected String doInBackground(String... args) { // Building Parameters List<NameValuePair> params = new ArrayList<NameValuePair>(); // getting JSON string from URL JSONObject json = jParser.makeHttpRequest(url_all_student, "GET", params); // Check your log cat for JSON response Log.d("All student : ", json.toString()); try { // Checking for SUCCESS TAG int success = json.getInt(TAG_SUCCESS); if (success == 1) { // student found // Getting Array of course student = json.getJSONArray(TAG_student); // looping through All courses for (int i = 0; i < student.length(); i++)//course JSONArray { JSONObject c = student.getJSONObject(i); // read first // Storing each json item in variable String StudentID = c.getString(TAG_StudentID); String StudentNo = c.getString(TAG_StudentNo); String FullName = c.getString(TAG_FullName); // String Avatar = c.getString(TAG_Avatar); // creating new HashMap HashMap<String, String> map = new HashMap<String, String>(); // adding each child node to HashMap key => value map.put(TAG_StudentID, StudentID); map.put(TAG_StudentNo, StudentNo); map.put(TAG_FullName, FullName); // adding HashList to ArrayList studentList.add(map); } } else { x=false; } } catch (JSONException e) { e.printStackTrace(); } return null; } /** * After completing background task Dismiss the progress dialog * **/ protected void onPostExecute(String file_url) { // dismiss the dialog after getting all products pDialog.dismiss(); if (x==false) Toast.makeText(getBaseContext(),"no student" ,Toast.LENGTH_LONG).show(); ListAdapter adapter = new SimpleAdapter( ManageSection.this, studentList, R.layout.list_student, new String[] { TAG_StudentID, TAG_StudentNo,TAG_FullName}, new int[] { R.id.StudentID, R.id.StudentNo,R.id.FullName}); setListAdapter(adapter); // Updating parsed JSON data into ListView } } } So what do you think, why doesn't the delete button work? There is no error in my log cat. What is the alternative way ?.. what should I do ?

    Read the article

  • navbar hover issue in ie8

    - by Joel
    I'm having a problem with a child list not hovering correctly in IE8. Other browsers and IE7 seem to work fine. Here is the site: http://rattletree.com/index_1.php If you hover over the nav bars you'll see the sub-list come into view. You can see that the arrow image is not below the navbar in IE8 only. html: <div id="navbar2"> <ul id="navbar"> <li id="index"><a href="index.php">About Rattletree</a></li> <li id="upcomingshows"><a href="upcomingshows.php">Calendar</a></li> <li id="booking"><a href="booking.php">Contact</a> <ul class="innerlist"> <li class="innerlist"><img class="arrowAdjust" src="images/curved_arrow.png"</img><a href="#">Booking Information</a></li> <li class="innerlist"><a href="#">Press</a></li> </ul> </li> <li id="instruments"><a href="instruments.php">The Band</a> <ul class="innerlist"> <li class="innerlist"><img class="arrowAdjust" src="images/curved_arrow.png"</img><a href="#">The Instruments</a></li> <li class="innerlist"><a href="#">The Players</a></li> </ul> </li> <li id="classes"><a href="classes.php">Sights &amp; Sounds</a> <ul class="innerlist"> <li class="innerlist"><img class="arrowAdjust" src="images/curved_arrow.png"</img><a href="#">Listen</a></li> <li class="innerlist"><a href="#">Photos</a></li> <li class="innerlist"><a href="#">Video</a></li> </ul> </li> <li id"classes"><a href="classes.php">Workshops &amp; Classes</a></li> </ul> </div> and css: /* OUTER LIST STYLING */ div#navbar2 { position:relative; width: 100%; border-top: solid #000 1px; border-bottom: solid #546F8B 1px; background-color: #546F8B; } div#navbar2 ul#navbar { padding: 0px; margin: 10px 0; font-family: Arial, Helvetica, sans-serif; font-size: 16px; letter-spacing:1px; color: #FFF; white-space: nowrap; display:block; } div#navbar2 ul#navbar li { position:relative; margin: 0px; padding:0px; list-style-type: none; display:inline; } div#navbar2 li a { text-decoration: none; color: #fff; margin:0; padding: 11px 12px; } div#navbar2 li a:link { color: #FFF: } div#navbar2 li a:visited { color: #ffffff; } div#navbar2 li a:hover { color: #000; background-color: #FDFFC9; } /* INNER LIST STYLING */ div#navbar2 ul#navbar li ul.innerlist{ display: none; color:#000; } div#navbar2 ul#navbar li ul.innerlist li{ color:#000; } div#navbar2 ul#navbar li:hover ul.innerlist { position: absolute; display: inline; left: 0; width: 100%; margin: 30px 0 0px 0px; padding: 0; color:#000; } div#navbar2 ul#navbar li.innerlist a { text-decoration: none; font-weight:bold; color: #000; padding: 10px 15px 20px 15px; margin:0; } div#navbar2 li.innerlist a:link { color: #000: } div#navbar2 li.innerlist a:visited { color: #000; } div#navbar2 ul#navbar li.innerlist a:hover { color: #e62d31; background-color:transparent; } img.arrowAdjust{ padding:0px 0 0 20px; margin:0; }

    Read the article

  • Why wont this entire word doc file generate from my php script?

    - by CheeseConQueso
    Here's the php script I'm using on a linux environment: <?php include("../_inc/odbcw.php"); //connect string $cat = $_GET["cat"]; if($_GET["st"]){$crs_query = "select crs_no, title, credits, abstr, prereq, coreq, lab_fee from xxx where active = 'Y' and cat = '".$cat."' and spec_top = 'Y' and prog='UNDG' order by crs_no";} else {$crs_query = "select crs_no, title, credits, abstr, prereq, coreq, lab_fee from xxx where active = 'Y' and cat = '".$cat."' and prog='UNDG' order by crs_no";} $crs_result = @mysql_query($crs_query); header("Content-type: application/vnd.ms-word"); header("Content-Disposition: attachment;Filename=cat.doc"); echo "<html>"; echo "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Windows-1252\">"; echo "<body>"; echo '<table border=0 width = 700>'; if($_GET["st"]){echo '<tr><td><font face=arial size=2><center>CATALOGUE<br>COURSE DESCRIPTIONS - '.$cat.'<br>SPECIAL TOPICS</center></font></td></tr>';} else {echo '<tr><td><font face=arial size=2><center>CATALOGUE<br>COURSE DESCRIPTIONS - '.$cat.'</center></font></td></tr>';} echo '</table>'; echo '<hr width=700>'; while($row = mysql_fetch_array($crs_result)) { $crs_no = $row['crs_no']; $title = $row['title']; $credits = $row['credits']; $abstr = $row['abstr']; $prereq = $row['prereq']; $coreq = $row['coreq']; $lab_fee = $row['lab_fee']; $rowspan = 2; if($prereq) {$rowspan++;} if($coreq) {$rowspan++;} if($lab_fee=="Y") {$rowspan++;} echo "<table border=0 width = 700>"; echo "<tr>"; echo "<td rowspan=".$rowspan." valign=top width=100><font face=arial size=2>".$crs_no."</font></td>"; echo "<td valign=top><font face=arial size=2><u>".$title."</u></font></td> <td valign=top align=right><font face=arial size=2>".$credits."</font></td>"; echo "</tr>"; echo "<tr>"; echo "<td colspan=2 valign=top align=justify><font face=arial size=2>".$abstr."</font></td>"; echo "</tr>"; if($prereq) { echo "<tr>"; echo "<td colspan=2 valign=top><font face=arial size=2>Prerequisite: ".$prereq."</font></td>"; echo "</tr>"; } if($coreq) { echo "<tr>"; echo "<td colspan=2 valign=top><font face=arial size=2>Coerequisite: ".$coreq."</font></td>"; echo "</tr>"; } if($lab_fee=="Y") { echo "<tr>"; echo "<td colspan=2 valign=top><font face=arial size=2>Lab Fee Required</font></td>"; echo "</tr>"; } echo "</table>"; echo "<br>"; } echo "</body>"; echo "</html>"; ?> Everything works fine before the inclusion of: header("Content-type: application/vnd.ms-word"); header("Content-Disposition: attachment;Filename=cat.doc"); echo "<html>"; echo "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Windows-1252\">"; echo "<body>"; These lines successfully bring up the dialogue box to open or save cat.doc, but after I open it, the only lines printed are: CATALOGUE COURSE DESCRIPTIONS - and the <HR> beneath this echoed text. It seems to go on lunch break for the while loop echoing section. Any ideas?

    Read the article

  • How to replace a div container with javascript

    - by Kovu
    Hi, I must have a little design in javascript. I have a menu with 5 entrys and only 1 HTML-page. So I will have a content-div and enabled and disabled different static content in it, each menu-entry is another content. I tried with 5 divs and disable 4 of them and enable 1, but the element under each other means every div is like a - enabled or not, so the "content" is moving then. Hope its understandable. Here is the code so far: <html><head><title>Des Einsame-Katerchen's kleine Homepage</title> <style type="text/css"> a:link { font-weight:bold; color:blue; text-decoration:none; } a:visited { font-weight:bold; color:blue; text-decoration:none; } a:focus { font-weight:bold; color:blue; text-decoration:none; } a:hover { font-weight:bold; color:blue; text-decoration:line-through; } a:active { font-weight:bold; color:blue; text-decoration:none; } h1:focus { background-color:red; } h1:hover { background-color:silver; } h1:active { background-color:green; } </style> <script> function an(id) { document.getElementById('start').style.visibility = 'hidden'; document.getElementById('start').style.height = '0px'; document.getElementById('me').style.visibility = 'hidden'; document.getElementById('me').style.height = '0px'; document.getElementById('rpg').style.visibility = 'hidden'; document.getElementById('rpg').style.height = '0px'; document.getElementById('musik').style.visibility = 'hidden'; document.getElementById('musik').style.height = '0px'; document.getElementById('screens').style.visibility = 'hidden'; document.getElementById('screens').style.height = '0px'; document.getElementById(id).style.visibility = 'visible'; document.getElementById(id).style.height = '500px'; } </script> </head> <body style=" " > <div style="width=100%; text-align:center; border: 1px red solid; height:40px;"> <div style="float:left; width:100px;"><a href="#" OnClick="an('start')" >Startseite</a></div> <div style="float:left; width:100px;"><a href="#" OnClick="an('me')" >Über mich</a></div> <div style="float:left; width:100px;"><a href="#" OnClick="an('rpg')" >RPG-Chars</a></div> <div style="float:left; width:100px;"><a href="#" OnClick="an('musik')" >Musik</a></div> <div style="float:left; width:150px;"><a href="#" OnClick="an('screens')" >Knuddels-Screens</a></div> </div> <br> <div id="start" style="border:1px red solid; width:500px; height:500px; overflow: visible; " > a </div> <div id="me" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > b </div> <div id="rpg" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > c </div> <div id="musik" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > d </div> <div id="screens" style="border:1px red solid; width:500px; height:0px; overflow: visible; visibility: hidden; " > e </div> </body>

    Read the article

  • Work time in fullcalendar [Solution]

    - by Zozo
    Full calendar have no included options to work-time feature (selecting first and last rows in agenda view for any day - where in example company is not working). I managed something like that: viewDisplay: function(view){ $.ajax({ url: 'index.php?r=calendar/Default/worktime', dataType: 'json', success: function(data){ if(view.name=='agendaWeek') selectWorkTime(data, 30, 0, 24, false); else if(view.name=='agendaDay') selectDayWorkTime(data, 30, 0, 24, view, false); } }); } Where index.php?r=calendar/Default/worktime is php file returning json. It looks like that: $arr = array( 'mon' => array('8:00', '17:00'), 'tue' => array('9:00', '15:00'), 'wed' => array('9:30', '19:00'), 'thu' => array('6:00', '14:00'), 'fri' => array('0:00', '24:00'), 'sat' => array('9:00', '14:00'), 'sun' => array() ); foreach ($arr as &$day){ foreach($day as &$hour){ $tmp = explode(':', $hour); $hour = $tmp[0] * 3600 + $tmp[1] * 60; } } print json_encode($arr); and at the end, some functions using for counting and selecting work-time: function selectDayWorkTime(timeArray, slotMinutes, minTime, maxTime, viewObject, showAtHolidays){ var dayname; $('.fc-content').find('.fc-view-agendaWeek').find('.fc-agenda-body') .children('.fc-work-time').remove(); $('.fc-content').find('.fc-view-agendaDay') .find('.fc-work-time-day').removeClass('fc-work-time-day'); switch(viewObject.start.getDay()){ case 1: dayname='mon'; break; case 2: dayname='tue'; break; case 3: dayname='wed'; break; case 4: dayname='thu'; break; case 5: dayname='fri'; break; case 6: dayname='sat'; break; case 0: dayname='sun'; break; } for(var day in timeArray){ if(day == dayname){ if($('.fc-content').find('.fc-view-agendaDay').find('.fc-'+day).attr('class').search('fc-holiday') == -1 || showAtHolidays){ var startBefore = 0; var endBefore = timeArray[day][0] / (60 * slotMinutes) - (minTime * 60) / slotMinutes; var startAfter = timeArray[day][1] / (60 * slotMinutes) - (minTime * 60) / slotMinutes; var endAfter = (maxTime - minTime) * 60 / slotMinutes - 1; for(startBefore; startBefore < endBefore; startBefore++){ $('.fc-view-agendaDay').find('.fc-slot'+startBefore).find('div').addClass('fc-work-time-day'); } for(startAfter; startAfter <= endAfter; startAfter++){ $('.fc-view-agendaDay').find('.fc-slot'+startAfter).find('div').addClass('fc-work-time-day'); } } } } } function selectWorkTime(timeArray, slotMinutes, minTime, maxTime, showAtHolidays){ for(var day in timeArray){ var startBefore = 0; var endBefore = timeArray[day][0] / (60 * slotMinutes) - (minTime * 60) / slotMinutes; var startAfter = timeArray[day][1] / (60 * slotMinutes) - (minTime * 60) / slotMinutes; var endAfter = (maxTime - minTime) * 60 / slotMinutes - 1; if(startBefore > endBefore) endBefore = startBefore; if(startAfter > endAfter) startAfter = endAfter; try{ selectCell(startBefore, endBefore, 'fc-'+day, 'fc-work-time', false, showAtHolidays); selectCell(startAfter, endAfter, 'fc-'+day, 'fc-work-time', true, showAtHolidays); } catch(e){ continue; } } } function selectCell(startRowNo, endRowNo, collClass, cellClass, closeGap, showAtHolidays){ $('.fc-content').find('.fc-view-agendaWeek').find('.fc-agenda-body') .children('.'+cellClass+''+startRowNo+''+collClass).remove(); $('.fc-content').find('.fc-view-agendaDay') .find('.fc-work-time-day').removeClass('fc-work-time-day'); if($('.fc-content').find('.fc-view-agendaWeek').find('.'+collClass).attr('class').search('fc-holiday') == -1 || showAtHolidays){ var width = $('.fc-content').find('.fc-view-agendaWeek') .find('.'+collClass+':last').width(); var height = 0; if(closeGap && (startRowNo != endRowNo)){ height = $('.fc-content').find('.fc-view-agendaWeek') .find('.fc-slot'+ startRowNo).height(); } $('.fc-view-agendaWeek').find('.fc-agenda-body').prepend('<div class="'+cellClass+' ' + ''+cellClass+''+startRowNo+''+collClass+'"></div>'); $('.'+cellClass).width(width - 2); height += $('.fc-content').find('.fc-view-agendaWeek') .find('.fc-slot'+ endRowNo).position().top - $('.fc-content').find('.fc-view-agendaWeek') .find('.fc-slot'+ startRowNo).position().top; $('.'+cellClass+''+startRowNo+''+collClass).height(height); $('.'+cellClass+''+startRowNo+''+collClass) .css('margin-top', $('.fc-content').find('.fc-view-agendaWeek') .find('.fc-slot'+ startRowNo).position().top); $('.'+cellClass+''+startRowNo+''+collClass) .css('margin-left', $('.fc-content').find('.fc-view-agendaWeek') .find('.'+collClass+':last').offset().left - width / 2); } } Don't forget about CSS: .fc-work-time-day{ background-color: yellow; opacity: 0.3; filter: alpha(opacity=30); /* for IE */ } .fc-work-time{ position: absolute; background-color: yellow; z-index:10; margin: 0; padding: 0; text-align: left; z-index: 0; opacity: 0.3; filter: alpha(opacity=30); /* for IE */ } So, I've got some questions about - is the other way to make the same, but no using absolute div's in agendaWeek? And... How can I get in viewDisplay function actual slotMinutes, minTime and maxTime

    Read the article

  • CSS Menu loses focus when part of jquery hover()

    - by Steve Syfuhs
    I have the following html (viewable at www.communityftw.com) <table width="100%"> <tr> <td style="text-align: left"> <!-- 2008.3.1314.35 --><span id="headerSearch1_sb_form_q_wrapper" class="RadInput_Default" style="white-space:nowrap;"><input value="language..." type="text" size="20" id="headerSearch1_sb_form_q_text" name="headerSearch1_sb_form_q_text" class="riTextBox riEmpty sw_qboxTop" name="q" style="width:140px;" /><input id="headerSearch1_sb_form_q" name="ctl00$headerSearch1$sb_form_q" class="rdfd_" style="visibility:hidden;margin:-18px 0 0 0;width:1px;height:1px;overflow:hidden;border:0;padding:0;" type="text" value="" /><input id="headerSearch1_sb_form_q_ClientState" name="headerSearch1_sb_form_q_ClientState" type="hidden" /></span> <input type="submit" name="ctl00$headerSearch1$sb_form_go" value="" id="headerSearch1_sb_form_go" class="sw_qbtnTop" /> </td> <td style="text-align: left"> <ul id="menu"> <li class="languageContainer"> <div> <a href="#" id="languageField"> <img src="/images/flags/ca.png" alt="Canada" /> Canada (English)</a> </div> <ul id="language"> <li><a href="#" id="A1"> <img src="/images/flags/ca.png" alt="Canada" /> Canada (French)</a> </li> <li><a href="#" id="A2"> <img src="/images/flags/us.png" alt="United States" /> United States</a> </li> <li><a href="#" id="A3"> <img src="/images/flags/de.png" alt="Germany" /> Germany</a> </li> <li><a href="#" id="A4"> <img src="/images/flags/fr.png" alt="France" /> France</a> </li> <li><a href="#" id="A5"> <img src="/images/flags/ru.png" alt="Russia" /> Russia</a> </li> <li class="last"> <img alt="" src="images/langLocDrop_r4_c1.png" /> </li> </ul> </li> </ul> </td> </tr> </table> Javascript/jquery $('#slide').animate({ top: '-=34' }, 1000); $("#slide").hover(function () { $(this).animate({ top: '+=34' }); }, function () { $(this).animate({ top: '-=34' }); }); menu { margin: 0px; padding: 0px; list-style: none; display: inline-block; float: left; z-index: 1000; } menu a { color: #dc2525; text-decoration: none; } menu li { background: none repeat scroll 0 0; cursor: pointer; float: left; position: relative; } menu li a:hover { color: orange; } menu ul { padding: 0px; margin: 0px; display: block; display: inline; } menu li ul { position: absolute; left: -15px; top: 0px; margin-top: 20px; width: 170px; line-height: 16px; background-image: url(/images/langLocDrop_r2_c1.png); display: none; } menu li:hover ul { display: block; } menu li ul li { display: block; margin: 5px 20px; padding: 5px 0px; border-top: dotted 1px #606060; list-style-type: none; } menu li ul li:first-child { border-top: none; } menu li ul li a { display: block; } menu li ul li a:hover { color: orange; } .languageContainer div { display: inline; padding: 5px; } languageField img { display: inline; vertical-align: middle; } language img { display: inline; } menu .last { background: transparent none repeat scroll 0% 0%; margin: 0px; padding: 0px; border: none; position: relative; border: none; height: 0px; } What I'm trying to do is have a menu mostly hidden at the top except when you mouse over it, and then have a submenu (just css driven) pop out when you mouse over the language. What is happening though is that when I move onto the language list, and I go past Germany (~50% down the list?), the hover() loses focus and closes the original menu, which closes the language menu. Any idea's what is causing the issue? Any ideas how to fix the issue? I have tried the hoverIntent() plugin as well to no avail.

    Read the article

< Previous Page | 278 279 280 281 282 283 284 285 286 287 288 289  | Next Page >