Search Results

Search found 2724 results on 109 pages for 'absolute positioning'.

Page 106/109 | < Previous Page | 102 103 104 105 106 107 108 109  | Next Page >

  • Can't update textbox in TinyMCE

    - by Michael Tot Korsgaard
    I'm using TinyMCE, the text area is replaced with a TextBox, but when I try to update the database with the new text from my textbox, it wont update. Can anyone help me? My code looks like this <%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="Test_TinyMCE._default" ValidateRequest="false" %> <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"> <script src="JavaScript/tiny_mce/tiny_mce.js" type="text/javascript"></script> <script type="text/javascript"> tinyMCE.init({ // General options mode: "textareas", theme: "advanced", plugins: "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,pre view,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,no nbreaking,xhtmlxtras,template,wordcount,advlist,autosave", // Theme options theme_advanced_buttons1: "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect", theme_advanced_buttons2: "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor", theme_advanced_buttons3: "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen", theme_advanced_buttons4: "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft", theme_advanced_toolbar_location: "top", theme_advanced_toolbar_align: "left", theme_advanced_statusbar_location: "bottom", theme_advanced_resizing: true, // Example content CSS (should be your site CSS) // using false to ensure that the default browser settings are used for best Accessibility // ACCESSIBILITY SETTINGS content_css: false, // Use browser preferred colors for dialogs. browser_preferred_colors: true, detect_highcontrast: true, // Drop lists for link/image/media/template dialogs template_external_list_url: "lists/template_list.js", external_link_list_url: "lists/link_list.js", external_image_list_url: "lists/image_list.js", media_external_list_url: "lists/media_list.js", // Style formats style_formats: [ { title: 'Bold text', inline: 'b' }, { title: 'Red text', inline: 'span', styles: { color: '#ff0000'} }, { title: 'Red header', block: 'h1', styles: { color: '#ff0000'} }, { title: 'Example 1', inline: 'span', classes: 'example1' }, { title: 'Example 2', inline: 'span', classes: 'example2' }, { title: 'Table styles' }, { title: 'Table row 1', selector: 'tr', classes: 'tablerow1' } ], // Replace values for the template plugin template_replace_values: { username: "Some User", staffid: "991234" } }); </script> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> <div> <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"></asp:TextBox> <br /> <asp:LinkButton ID="LinkButton1" runat="server" onclick="LinkButton1_Click">Update</asp:LinkButton> </div> </asp:Content> My codebhind looks like this using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace Test_TinyMCE { public partial class _default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { TextBox1.Text = Database.GetFirst().Text; } protected void LinkButton1_Click(object sender, EventArgs e) { Database.Update(Database.GetFirst().ID, TextBox1.Text); TextBox1.Text = Database.GetFirst().Text; } } } And finally the "Database" class im using looks like this using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Configuration; using System.Data.SqlClient; namespace Test_TinyMCE { public class Database { public int ID { get; set; } public string Text { get; set; } public static void Update(int ID, string Text) { SqlConnection connection = new SqlConnection(ConfigurationManager.AppSettings["DatabaseConnection"]); connection.Open(); try { SqlCommand command = new SqlCommand("Update Text set Text=@text where ID=@id"); command.Connection = connection; command.Parameters.Add(new SqlParameter("id", ID)); command.Parameters.Add(new SqlParameter("text", Text)); command.ExecuteNonQuery(); } finally { connection.Close(); } } public static Database GetFirst() { SqlConnection connection = new SqlConnection(ConfigurationManager.AppSettings["DatabaseConnection"]); connection.Open(); try { SqlCommand command = new SqlCommand("Select Top 1 ID, Text from Text order by ID asc"); command.Connection = connection; SqlDataReader reader = command.ExecuteReader(); if (reader.Read()) { Database item = new Database(); item.ID = reader.GetInt32(0); item.Text = reader.GetString(1); return item; } else { return null; } } finally { connection.Close(); } } } } I really hope that someone out there 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

  • Son of Suckerfish ie6 problem - right-most dropdown menu also appearing on left side of screen

    - by Kevin Burke
    I'm interning for an NGO in India and trying to fix their website, including updating their menu so it's not the last item on the page to load, and it's centered on the screen. Everything works well enough but when I try out my new menu in IE6, I get this weird error where the content below the menu is padded an extra 30px or so and the material in the right-most drop down appears on the far left of the screen, always visible. When I drop down the rightmost link ("Publications") the content appears both in the correct location and in the same spot on the far left of the screen, and changes color when I hover as well. It's tough to describe, so it would probably be best if you took a look: visit http://sevamandir.org/a30/index.htm in your Internet Explorer 6 browser to see for yourself. I really appreciate your help. Also I'm using a 1000px wide monitor, if there's more hijinks going on outside that space I'd like to know about that too. Here's the relevant code: in the html head: <script> sfHover = function() { var sfEls = document.getElementById("nav").getElementsByTagName("LI"); for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" sfhover"; } sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" sfhover\\b"), ""); } } } if (window.attachEvent) window.attachEvent("onload", sfHover); </script> text surrounding the menu - the menu is simply <ul id="nav"><li></li></ul> etc. <!--begin catchphrase--> <div style="float:left; height:27px; width:520px; margin:0px; font:16px Arial, Helvetica, sans-serif; font-weight:bold; color:#769841;"> Transforming lives through democratic &amp; participatory development </div> <?php include("menu.php"); ?> </div><!-- end header --> <!--begin main text div--> <div id="maincontent"> Relevant menu CSS: #nav, #nav ul { font:bold 11px Verdana, sans-serif; float: left; width: 980px; list-style: none; line-height: 1; background: white; font-weight: bold; padding: 0; border: solid #769841; border-width: 0; margin: 0 0 1em 0; } #nav a { display: block; width: 140px; /*this is the total width of the upper menu*/ w\idth: 120px; /*this is the width less horizontal padding */ padding: 5px 10px 5px 10px; /*horiz padding is the 2nd & 4th items here - goes Top Right Bottom Left */ color: #ffffff; background:#b6791e; text-decoration: none; } #nav a.daddy { background: url(rightarrow2.gif) center right no-repeat; } #nav li { float: left; padding: 0; width: 140px; /*this needs to be updated to match top #nav a */ background:#b6791e; } #nav li:hover, #nav li a:hover, #nav li:hover a { background:#769841; } #nav li:hover li a { background:#ffffff; color:#769841; } #nav li ul { position: absolute; left: -999em; height: auto; width: 14.4em; w\idth: 13.9em; font-weight: bold; border-width: 0.25em; /*green border around dropdown menu*/ margin: 0; } #nav li ul a { background:#ffffff; color:#769841; } #nav li li { padding-right: 1em; width: 13em; background:#ffffff; } #nav li ul a { width: 13em; w\idth: 9em; } #nav li ul ul { margin: -1.75em 0 0 14em; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left: -999em; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: auto; } #nav li:hover, #nav li.sfhover, { background: #769841; color:#ffe400; } #nav li a:hover, #nav li li a:hover, #nav li:hover li:hover, #nav li.sfhover a:hover { background: #769841; color:#ffe400; }

    Read the article

  • Accessing py2exe program over network in Windows 98 throws ImportErrors

    - by darvids0n
    I'm running a py2exe-compiled python program from one server machine on a number of client machines (mapped to a network drive on every machine, say W:). For Windows XP and later machines, have so far had zero problems with Python picking up W:\python23.dll (yes, I'm using Python 2.3.5 for W98 compatibility and all that). It will then use W:\zlib.pyd to decompress W:\library.zip containing all the .pyc files like os and such, which are then imported and the program runs no problems. The issue I'm getting is on some Windows 98 SE machines (note: SOME Windows 98 SE machines, others seem to work with no apparent issues). What happens is, the program runs from W:, the W:\python23.dll is, I assume, found (since I'm getting Python ImportErrors, we'd need to be able to execute a Python import statement), but a couple of things don't work: 1) If W:\library.zip contains the only copy of the .pyc files, I get ZipImportError: can't decompress data; zlib not available (nonsense, considering W:\zlib.pyd IS available and works fine with the XP and higher machines on the same network). 2) If the .pyc files are actually bundled INSIDE the python exe by py2exe, OR put in the same directory as the .exe, OR put into a named subdirectory which is then set as part of the PYTHONPATH variable (e.g W:\pylib), I get ImportError: no module named os (os is the first module imported, before sys and anything else). Come to think of it, sys.path wouldn't be available to search if os was imported before it maybe? I'll try switching the order of those imports but my question still stands: Why is this a sporadic issue, working on some networks but not on others? And how would I force Python to find the files that are bundled inside the very executable I run? I have immediate access to the working Windows 98 SE machine, but I only get access to the non-working one (a customer of mine) every morning before their store opens. Thanks in advance! EDIT: Okay, big step forward. After debugging with PY2EXE_VERBOSE, the problem occurring on the specific W98SE machine is that it's not using the right path syntax when looking for imports. Firstly, it doesn't seem to read the PYTHONPATH environment variable (there may be a py2exe-specific one I'm not aware of, like PY2EXE_VERBOSE). Secondly, it only looks in one place before giving up (if the files are bundled inside the EXE, it looks there. If not, it looks in library.zip). EDIT 2: In fact, according to this, there is a difference between the sys.path in the Python interpreter and that of Py2exe executables. Specifically, sys.path contains only a single entry: the full pathname of the shared code archive. Blah. No fallbacks? Not even the current working directory? I'd try adding W:\ to PATH, but py2exe doesn't conform to any sort of standards for locating system libraries, so it won't work. Now for the interesting bit. The path it tries to load atexit, os, etc. from is: W:\\library.zip\<module>.<ext> Note the single slash after library.zip, but the double slash after the drive letter (someone correct me if this is intended and should work). It looks like if this is a string literal, then since the slash isn't doubled, it's read as an (invalid) escape sequence and the raw character is printed (giving W:\library.zipos.pyd, W:\library.zipos.dll, ... instead of with a slash); if it is NOT a string literal, the double slash might not be normpath'd automatically (as it should be) and so the double slash confuses the module loader. Like I said, I can't just set PYTHONPATH=W:\\library.zip\\ because it ignores that variable. It may be worth using sys.path.append at the start of my program but hard-coding module paths is an absolute LAST resort, especially since the problem occurs in ONE configuration of an outdated OS. Any ideas? I have one, which is to normpath the sys.path.. pity I need os for that. Another is to just append os.getenv('PATH') or os.getenv('PYTHONPATH') to sys.path... again, needing the os module. The site module also fails to initialise, so I can't use a .pth file. I also recently tried the following code at the start of the program: for pth in sys.path: fErr.write(pth) fErr.write(' to ') pth.replace('\\\\','\\') # Fix Windows 98 pathing issues fErr.write(pth) fErr.write('\n') But it can't load linecache.pyc, or anything else for that matter; it can't actually execute those commands from the looks of things. Is there any way to use built-in functionality which doesn't need linecache to modify the sys.path dynamically? Or am I reduced to hard-coding the correct sys.path?

    Read the article

  • Conflict between two Javascripts (MailChimp validation etc. scripts & jQuery hSlides.js)

    - by Brian
    I have two scripts running on the same page, one is the jQuery.hSlides.js script http://www.jesuscarrera.info/demos/hslides/ and the other is a custom script that is used for MailChimp list signup integration. The hSlides panel can be seen in effect here: http://theatricalbellydance.com. I've turned off the MailChimp script because it was conflicting with the hSlides script, causing it not to to fail completely (as seen here http://theatricalbellydance.com/home2/). Can someone tell me what could be done to the hSlides script to stop the conflict with the MailChimp script? The MailChimp Script var fnames = new Array(); var ftypes = new Array(); fnames[0] = 'EMAIL'; ftypes[0] = 'email'; fnames[3] = 'MMERGE3'; ftypes[3] = 'text'; fnames[1] = 'FNAME'; ftypes[1] = 'text'; fnames[2] = 'LNAME'; ftypes[2] = 'text'; fnames[4] = 'MMERGE4'; ftypes[4] = 'address'; fnames[6] = 'MMERGE6'; ftypes[6] = 'number'; fnames[9] = 'MMERGE9'; ftypes[9] = 'text'; fnames[5] = 'MMERGE5'; ftypes[5] = 'text'; fnames[7] = 'MMERGE7'; ftypes[7] = 'text'; fnames[8] = 'MMERGE8'; ftypes[8] = 'text'; fnames[10] = 'MMERGE10'; ftypes[10] = 'text'; fnames[11] = 'MMERGE11'; ftypes[11] = 'text'; fnames[12] = 'MMERGE12'; ftypes[12] = 'text'; var err_style = ''; try { err_style = mc_custom_error_style; } catch (e) { err_style = 'margin: 1em 0 0 0; padding: 1em 0.5em 0.5em 0.5em; background: rgb(255, 238, 238) none repeat scroll 0% 0%; font-weight: bold; float: left; z-index: 1; width: 80%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(255, 0, 0);'; } var mce_jQuery = jQuery.noConflict(); mce_jQuery(document).ready(function ($) { var options = { errorClass: 'mce_inline_error', errorElement: 'div', errorStyle: err_style, onkeyup: function () {}, onfocusout: function () {}, onblur: function () {} }; var mce_validator = mce_jQuery("#mc-embedded-subscribe-form").validate(options); options = { url: 'http://theatricalbellydance.us1.list-manage.com/subscribe/post-json?u=1d127e7630ced825cb1a8b5a9&id=9f12d2a6bb&c=?', type: 'GET', dataType: 'json', contentType: "application/json; charset=utf-8", beforeSubmit: function () { mce_jQuery('#mce_tmp_error_msg').remove(); mce_jQuery('.datefield', '#mc_embed_signup').each(function () { var txt = 'filled'; var fields = new Array(); var i = 0; mce_jQuery(':text', this).each(function () { fields[i] = this; i++; }); mce_jQuery(':hidden', this).each(function () { if (fields[0].value == 'MM' && fields[1].value == 'DD' && fields[2].value == 'YYYY') { this.value = ''; } else if (fields[0].value == '' && fields[1].value == '' && fields[2].value == '') { this.value = ''; } else { this.value = fields[0].value + '/' + fields[1].value + '/' + fields[2].value; } }); }); return mce_validator.form(); }, success: mce_success_cb }; mce_jQuery('#mc-embedded-subscribe-form').ajaxForm(options); }); function mce_success_cb(resp) { mce_jQuery('#mce-success-response').hide(); mce_jQuery('#mce-error-response').hide(); if (resp.result == "success") { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(resp.msg); mce_jQuery('#mc-embedded-subscribe-form').each(function () { this.reset(); }); } else { var index = -1; var msg; try { var parts = resp.msg.split(' - ', 2); if (parts[1] == undefined) { msg = resp.msg; } else { i = parseInt(parts[0]); if (i.toString() == parts[0]) { index = parts[0]; msg = parts[1]; } else { index = -1; msg = resp.msg; } } } catch (e) { index = -1; msg = resp.msg; } try { if (index == -1) { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(msg); } else { err_id = 'mce_tmp_error_msg'; html = '<div id="' + err_id + '" style="' + err_style + '"> ' + msg + '</div>'; var input_id = '#mc_embed_signup'; var f = mce_jQuery(input_id); if (ftypes[index] == 'address') { input_id = '#mce-' + fnames[index] + '-addr1'; f = mce_jQuery(input_id).parent().parent().get(0); } else if (ftypes[index] == 'date') { input_id = '#mce-' + fnames[index] + '-month'; f = mce_jQuery(input_id).parent().parent().get(0); } else { input_id = '#mce-' + fnames[index]; f = mce_jQuery().parent(input_id).get(0); } if (f) { mce_jQuery(f).append(html); mce_jQuery(input_id).focus(); } else { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(msg); } } } catch (e) { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(msg); } } } The hslides script: /* * hSlides (1.0) // 2008.02.25 // <http://plugins.jquery.com/project/hslides> * * REQUIRES jQuery 1.2.3+ <http://jquery.com/> * * Copyright (c) 2008 TrafficBroker <http://www.trafficbroker.co.uk> * Licensed under GPL and MIT licenses * * hSlides is an horizontal accordion navigation, sliding the panels around to reveal one of interest. * * Sample Configuration: * // this is the minimum configuration needed * $('#accordion').hSlides({ * totalWidth: 730, * totalHeight: 140, * minPanelWidth: 87, * maxPanelWidth: 425 * }); * * Config Options: * // Required configuration * totalWidth: Total width of the accordion // default: 0 * totalHeight: Total height of the accordion // default: 0 * minPanelWidth: Minimum width of the panel (closed) // default: 0 * maxPanelWidth: Maximum width of the panel (opened) // default: 0 * // Optional configuration * midPanelWidth: Middle width of the panel (centered) // default: 0 * speed: Speed for the animation // default: 500 * easing: Easing effect for the animation. Other than 'swing' or 'linear' must be provided by plugin // default: 'swing' * sensitivity: Sensitivity threshold (must be 1 or higher) // default: 3 * interval: Milliseconds for onMouseOver polling interval // default: 100 * timeout: Milliseconds delay before onMouseOut // default: 300 * eventHandler: Event to open panels: click or hover. For the hover option requires hoverIntent plugin <http://cherne.net/brian/resources/jquery.hoverIntent.html> // default: 'click' * panelSelector: HTML element storing the panels // default: 'li' * activeClass: CSS class for the active panel // default: none * panelPositioning: Accordion panelPositioning: top -> first panel on the bottom and next on the top, other value -> first panel on the top and next to the bottom // default: 'top' * // Callback funtctions. Inside them, we can refer the panel with $(this). * onEnter: Funtion raised when the panel is activated. // default: none * onLeave: Funtion raised when the panel is deactivated. // default: none * * We can override the defaults with: * $.fn.hSlides.defaults.easing = 'easeOutCubic'; * * @param settings An object with configuration options * @author Jesus Carrera <[email protected]> */ (function($) { $.fn.hSlides = function(settings) { // override default configuration settings = $.extend({}, $.fn.hSlides.defaults, settings); // for each accordion return this.each(function(){ var wrapper = this; var panelLeft = 0; var panels = $(settings.panelSelector, wrapper); var panelPositioning = 1; if (settings.panelPositioning != 'top'){ panelLeft = ($(settings.panelSelector, wrapper).length - 1) * settings.minPanelWidth; panels = $(settings.panelSelector, wrapper).reverse(); panelPositioning = -1; } // necessary styles for the wrapper $(this).css('position', 'relative').css('overflow', 'hidden').css('width', settings.totalWidth).css('height', settings.totalHeight); // set the initial position of the panels var zIndex = 0; panels.each(function(){ // necessary styles for the panels $(this).css('position', 'absolute').css('left', panelLeft).css('zIndex', zIndex).css('height', settings.totalHeight).css('width', settings.maxPanelWidth); zIndex ++; // if this panel is the activated by default, set it as active and move the next (to show this one) if ($(this).hasClass(settings.activeClass)){ $.data($(this)[0], 'active', true); if (settings.panelPositioning != 'top'){ panelLeft = ($(settings.panelSelector, wrapper).index(this) + 1) * settings.minPanelWidth - settings.maxPanelWidth; }else{ panelLeft = panelLeft + settings.maxPanelWidth; } }else{ // check if we are centering and some panel is active // this is why we can't add/remove the active class in the callbacks: positioning the panels if we have one active if (settings.midPanelWidth && $(settings.panelSelector, wrapper).hasClass(settings.activeClass) == false){ panelLeft = panelLeft + settings.midPanelWidth * panelPositioning; }else{ panelLeft = panelLeft + settings.minPanelWidth * panelPositioning; } } }); // iterates through the panels setting the active and changing the position var movePanels = function(){ // index of the new active panel var activeIndex = $(settings.panelSelector, wrapper).index(this); // iterate all panels panels.each(function(){ // deactivate if is the active if ( $.data($(this)[0], 'active') == true ){ $.data($(this)[0], 'active', false); $(this).removeClass(settings.activeClass).each(settings.onLeave); } // set position of current panel var currentIndex = $(settings.panelSelector, wrapper).index(this); panelLeft = settings.minPanelWidth * currentIndex; // if the panel is next to the active, we need to add the opened width if ( (currentIndex * panelPositioning) > (activeIndex * panelPositioning)){ panelLeft = panelLeft + (settings.maxPanelWidth - settings.minPanelWidth) * panelPositioning; } // animate $(this).animate({left: panelLeft}, settings.speed, settings.easing); }); // activate the new active panel $.data($(this)[0], 'active', true); $(this).addClass(settings.activeClass).each(settings.onEnter); }; // center the panels if configured var centerPanels = function(){ var panelLeft = 0; if (settings.panelPositioning != 'top'){ panelLeft = ($(settings.panelSelector, wrapper).length - 1) * settings.minPanelWidth; } panels.each(function(){ $(this).removeClass(settings.activeClass).animate({left: panelLeft}, settings.speed, settings.easing); if ($.data($(this)[0], 'active') == true){ $.data($(this)[0], 'active', false); $(this).each(settings.onLeave); } panelLeft = panelLeft + settings.midPanelWidth * panelPositioning ; }); }; // event handling if(settings.eventHandler == 'click'){ $(settings.panelSelector, wrapper).click(movePanels); }else{ var configHoverPanel = { sensitivity: settings.sensitivity, interval: settings.interval, over: movePanels, timeout: settings.timeout, out: function() {} } var configHoverWrapper = { sensitivity: settings.sensitivity, interval: settings.interval, over: function() {}, timeout: settings.timeout, out: centerPanels } $(settings.panelSelector, wrapper).hoverIntent(configHoverPanel); if (settings.midPanelWidth != 0){ $(wrapper).hoverIntent(configHoverWrapper); } } }); }; // invert the order of the jQuery elements $.fn.reverse = function(){ return this.pushStack(this.get().reverse(), arguments); }; // default settings $.fn.hSlides.defaults = { totalWidth: 0, totalHeight: 0, minPanelWidth: 0, maxPanelWidth: 0, midPanelWidth: 0, speed: 500, easing: 'swing', sensitivity: 3, interval: 100, timeout: 300, eventHandler: 'click', panelSelector: 'li', activeClass: false, panelPositioning: 'top', onEnter: function() {}, onLeave: function() {} }; })(jQuery);

    Read the article

  • Choosing a scripting language for game and implementing it

    - by Radius
    Hello, I am currently developing a 3D Action/RPG game in C++, and I would like some advice in choosing a scripting language to program the AI of the game. My team comes from a modding background, and in fact we are still finishing work on a mod of the game Gothic. In that game (which we also got our inspiration from) the language DAEDALUS (created by Piranha Bytes, the makers of the game) is used. Here is a full description of said language. The main thing to notice about this is that it uses instances moreso than classes. The game engine is closed, and so one can only guess about the internal implementation of this language, but the main thing I am looking for in a scripting language (which ideally would be quite similar but preferably also more powerful than DAEDALUS) is the fact that there are de facto 3 'separations' of classes - ie classes, instances and (instances of instances?). I think it will be easier to understand what I want if I provide an example. Take a regular NPC. First of all you have a class defined which (I understand) mirrors the (class or structure) inside the engine: CLASS C_NPC { VAR INT id ; // absolute ID des NPCs VAR STRING name [5] ; // Namen des NPC VAR STRING slot ; VAR INT npcType ; VAR INT flags ; VAR INT attribute [ATR_INDEX_MAX] ; VAR INT protection [PROT_INDEX_MAX]; VAR INT damage [DAM_INDEX_MAX] ; VAR INT damagetype ; VAR INT guild,level ; VAR FUNC mission [MAX_MISSIONS] ; var INT fight_tactic ; VAR INT weapon ; VAR INT voice ; VAR INT voicePitch ; VAR INT bodymass ; VAR FUNC daily_routine ; // Tagesablauf VAR FUNC start_aistate ; // Zustandsgesteuert // ********************** // Spawn // ********************** VAR STRING spawnPoint ; // Beim Tod, wo respawnen ? VAR INT spawnDelay ; // Mit Delay in (Echtzeit)-Sekunden // ********************** // SENSES // ********************** VAR INT senses ; // Sinne VAR INT senses_range ; // Reichweite der Sinne in cm // ********************** // Feel free to use // ********************** VAR INT aivar [50] ; VAR STRING wp ; // ********************** // Experience dependant // ********************** VAR INT exp ; // EXerience Points VAR INT exp_next ; // EXerience Points needed to advance to next level VAR INT lp ; // Learn Points }; Then, you can also define prototypes (which set some default values). But how you actually define an NPC is like this: instance BAU_900_Ricelord (Npc_Default) //Inherit from prototype Npc_Default { //-------- primary data -------- name = "Ryzowy Ksiaze"; npctype = NPCTYPE_GUARD; guild = GIL_BAU; level = 10; voice = 12; id = 900; //-------- abilities -------- attribute[ATR_STRENGTH] = 50; attribute[ATR_DEXTERITY] = 10; attribute[ATR_MANA_MAX] = 0; attribute[ATR_MANA] = 0; attribute[ATR_HITPOINTS_MAX]= 170; attribute[ATR_HITPOINTS] = 170; //-------- visuals -------- // animations Mdl_SetVisual (self,"HUMANS.MDS"); Mdl_ApplyOverlayMds (self,"Humans_Arrogance.mds"); Mdl_ApplyOverlayMds (self,"HUMANS_DZIDA.MDS"); // body mesh ,bdytex,skin,head mesh ,headtex,teethtex,ruestung Mdl_SetVisualBody (self,"Hum_Body_CookSmith",1,1,"Hum_Head_FatBald",91 , 0,-1); B_Scale (self); Mdl_SetModelFatness(self,2); fight_tactic = FAI_HUMAN_STRONG; //-------- Talente -------- Npc_SetTalentSkill (self,NPC_TALENT_1H,1); //-------- inventory -------- CreateInvItems (self, ItFoRice,10); CreateInvItem (self, ItFoWine); CreateInvItems(self, ItMiNugget,40); EquipItem (self, Heerscherstab); EquipItem (self, MOD_AMULETTDESREISLORDS); CreateInvItem (self, ItMi_Alchemy_Moleratlubric_01); //CreateInvItem (self,ItKey_RB_01); EquipItem (self, Ring_des_Lebens); //-------------Daily Routine------------- daily_routine = Rtn_start_900; }; FUNC VOID Rtn_start_900 () { TA_Boss (07,00,20,00,"NC_RICELORD"); TA_SitAround (20,00,24,00,"NC_RICELORD_SIT"); TA_Sleep (24,00,07,00,"NC_RICEBUNKER_10"); }; As you can see, the instance declaration is more like a constructor function, setting values and calling functions from within. This still wouldn't pose THAT much of a problem, if not for one more thing: multiple copies of this instance. For example, you can spawn multiple BAU_900_Ricelord's, and each of them keeps track of its own AI state, hitpoints etc. Now I think the instances are represented as ints (maybe even as the id of the NPC) inside the engine, as whenever (inside the script) you use the expression BAU_900_Ricelord it can be only assigned to an int variable, and most functions that operate on NPCs take that int value. However to directly modify its hitpoints etc you have to do something like var C_NPC npc = GetNPC(Bau_900_Ricelord); npc.attribute[ATR_HITPOINTS] = 10; ie get the actual C_NPC object that represents it. To finally recap - is it possible to get this kind of behaviour in any scripting languages you know of, or am I stuck with having to make my own? Or maybe there is an even better way of representing NPC's and their behaviours that way. The IDEAL language for scripting for me would be C#, as I simply adore that language, but somehow I doubt it is possible or indeed feasible to try and implement a similar kind of behaviour in C#. Many thanks

    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

  • Javascript stockticker : not showing data on php page

    - by developer
    iam not getting any javascript errors , code is getting rendered properly only, but still server not displaying data on the page. please check the code below . <style type="text/css"> #marqueeborder { color: #cccccc; background-color: #EEF3E2; font-family:"Lucida Console", Monaco, monospace; position:relative; height:20px; overflow:hidden; font-size: 0.7em; } #marqueecontent { position:absolute; left:0px; line-height:20px; white-space:nowrap; } .stockbox { margin:0 10px; } .stockbox a { color: #cccccc; text-decoration : underline; } </style> </head> <body> <div id="marqueeborder" onmouseover="pxptick=0" onmouseout="pxptick=scrollspeed"> <div id="marqueecontent"> <?php // Original script by Walter Heitman Jr, first published on http://techblog.shanock.com // List your stocks here, separated by commas, no spaces, in the order you want them displayed: $stocks = "idt,iye,mill,pwer,spy,f,msft,x,sbux,sne,ge,dow,t"; // Function to copy a stock quote CSV from Yahoo to the local cache. CSV contains symbol, price, and change function upsfile($stock) { copy("http://finance.yahoo.com/d/quotes.csv?s=$stock&f=sl1c1&e=.csv","stockcache/".$stock.".csv"); } foreach ( explode(",", $stocks) as $stock ) { // Where the stock quote info file should be... $local_file = "stockcache/".$stock.".csv"; // ...if it exists. If not, download it. if (!file_exists($local_file)) { upsfile($stock); } // Else,If it's out-of-date by 15 mins (900 seconds) or more, update it. elseif (filemtime($local_file) <= (time() - 900)) { upsfile($stock); } // Open the file, load our values into an array... $local_file = fopen ("stockcache/".$stock.".csv","r"); $stock_info = fgetcsv ($local_file, 1000, ","); // ...format, and output them. I made the symbols into links to Yahoo's stock pages. echo "<span class=\"stockbox\"><a href=\"http://finance.yahoo.com/q?s=".$stock_info[0]."\">".$stock_info[0]."</a> ".sprintf("%.2f",$stock_info[1])." <span style=\""; // Green prices for up, red for down if ($stock_info[2]>=0) { echo "color: #009900;\">&uarr;"; } elseif ($stock_info[2]<0) { echo "color: #ff0000;\">&darr;"; } echo sprintf("%.2f",abs($stock_info[2]))."</span></span>\n"; // Done! fclose($local_file); } ?> <span class="stockbox" style="font-size:0.6em">Quotes from <a href="http://finance.yahoo.com/">Yahoo Finance</a></span> </div> </div> </body> <script type="text/javascript"> // Original script by Walter Heitman Jr, first published on http://techblog.shanock.com // Set an initial scroll speed. This equates to the number of pixels shifted per tick var scrollspeed=2; var pxptick=scrollspeed; var marqueediv=''; var contentwidth=""; var marqueewidth = ""; function startmarquee(){ alert("hi"); // Make a shortcut referencing our div with the content we want to scroll marqueediv=document.getElementById("marqueecontent"); //alert("marqueediv"+marqueediv); alert("hi"+marqueediv.innerHTML); // Get the total width of our available scroll area marqueewidth=document.getElementById("marqueeborder").offsetWidth; alert("marqueewidth"+marqueewidth); // Get the width of the content we want to scroll contentwidth=marqueediv.offsetWidth; alert("contentwidth"+contentwidth); // Start the ticker at 50 milliseconds per tick, adjust this to suit your preferences // Be warned, setting this lower has heavy impact on client-side CPU usage. Be gentle. var lefttime=setInterval("scrollmarquee()",50); alert("lefttime"+lefttime); } function scrollmarquee(){ // Check position of the div, then shift it left by the set amount of pixels. if (parseInt(marqueediv.style.left)>(contentwidth*(-1))) marqueediv.style.left=parseInt(marqueediv.style.left)-pxptick+"px"; //alert("hikkk"+marqueediv.innerHTML);} // If it's at the end, move it back to the right. else{ alert("marqueewidth"+marqueewidth); marqueediv.style.left=parseInt(marqueewidth)+"px"; } } window.onload=startmarquee; </script> </html> Below is the server displayed page. I have updated with screenshot with your suggestion, i made change in html too, to check what is showing by child dev

    Read the article

  • AIR:- Desktop Application related to Window Component (Need some work around)

    - by Mahesh Parate
    Create custom component which contains Combobox and Datagrid. Application conations two button 1) Same Window and 2) New Window. (Label of two button) When you click on “Same Window” button your custom component should get added dynamically in your application. And when you click on “New Window” button your custom component should get open in different window (it should get shifted from application and should appear in Window component). Issue faced:- Clicking on Combobox, list is not getting open as change event doesn’t get fired in Native Window as it looses reference from main application. Issue with DataGrid in Native window (AIR). • DataGridEvent.COLUMN_STRETCH event get affected if try to open datagrid in Native Window. • DataGridEvent get fired but takes long time or even stuck while column stretch Note: Application is an Desktop Application. Only one instance is created in Application for your custom component to preserve current state on your custom component it can be Style, data, or other subcomponent state of your custom component (as above mentioned 2 component are just sample). Please find sample code below:- DataGridStretchIssue.mxml:- < ?xml version="1.0" encoding="utf-8"? < mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*" width="800" height="500" < mx:Script < ![CDATA[ import mx.events.FlexEvent; import mx.core.Window; private var dgComp:DataGridComp = new DataGridComp(); private var win:Window; private function clickHandler(event:Event):void{ dgComp.percentWidth = 100; dgComp.percentHeight = 100; dgComp.x = 50; dgComp.y = 100; if(win){ win.close(); } this.addChild(dgComp); } private function openClickHandler(event:MouseEvent):void{ dgComp.x = 50; dgComp.y = 100; win = new Window();; win.width = 800; win.height = 500; win.addChild(dgComp); dgComp.percentWidth = 100; dgComp.percentHeight = 100; dgComp.x = 50; dgComp.y = 100; win.open(true) } ]]> < /mx:Script < mx:HBox <mx:Button id="btnID" click="clickHandler(event)" label="Same Window"/> <mx:Button id="btnIDOpen" click="openClickHandler(event)" label="New Window"/> < /mx:HBox < /mx:WindowedApplication DataGridComp.mxml < ?xml version="1.0" encoding="utf-8"? < mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" <mx:Script> <![CDATA[ import mx.events.DataGridEvent; import mx.collections.ArrayCollection; [Bindable] public var cards:ArrayCollection = new ArrayCollection( [ {label:"Visa", data:1}, {label:"MasterCard", data:2}, {label:"American Express", data:3} ]); private function stretchFn(event:DataGridEvent):void{ trace("--- Stretched---") } ]]> </mx:Script> <mx:HBox> <mx:ComboBox dataProvider="{cards}" width="150"/> <mx:DataGrid columnStretch="stretchFn(event)" > <mx:ArrayCollection> <mx:Object> <mx:Artist>Pavement</mx:Artist> <mx:Price>11.99</mx:Price> <mx:Album>Slanted and Enchanted</mx:Album> </mx:Object> <mx:Object> <mx:Artist>Pavement</mx:Artist> <mx:Album>Brighten the Corners</mx:Album> <mx:Price>11.99</mx:Price> </mx:Object> </mx:ArrayCollection> </mx:DataGrid> </mx:HBox> < /mx:Canvas Can any one suggest me some work around to make my code workable... :)

    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

  • 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

  • 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

  • Javascript: Can't control parent of descendant nodes.

    - by .phjasper
    I'm creating elements (level 1) dynamically which in turn create elements (level 2) themselves. However, the children of level 2 elements have "body" as their parent. In the HTML code below, the content if spotAd2 is created by my function createNode(). It's a Google Ad Sense tag. However, the Google Ad Sense tag create elements that went directly under "body". I need them to by under spotAd2. function createNode( t, // type. tn, // if type is element, tag name. a, // if type is element, attributes. v, // node value or text content p, // parent f ) // whether to make dist the first child or not. { n = null; switch( t ) { case "element": n = document.createElement( tn ); if( a ) { for( k in a ) { n.setAttribute( k, a[ k ] ); } } break; case "text": case "cdata_section": case "comment": n = document.createTextNode(v); break; } if ( p ) { if( f ) { p.insertBefore( n, p.firstChild ); } else { p.appendChild( n ); } } return n; } spotAd2 = document.getElementById("spotAd2"); n1 = createNode("element", "div", {"id":"tnDiv1"}, "\n" , null, true); n2 = createNode("element", "script", {"type":"text\/javascript"}, "\n" , n1, false); n3 = createNode("comment", "", null, "\n" + "google_ad_client = \"pub-0321943928525350\";\n" + "/* 728x90 (main top) */\n" + "google_ad_slot = \"2783893649\";\n" + "google_ad_width = 728;\n" + "google_ad_height = 90;\n" + "//\n" , n2, false); n4 = createNode("element", "script", {"type":"text\/javascript","src":"http:\/\/pagead2.googlesyndication.com\/pagead\/show_ads.js"}, "\n" , n1, false); --- Result: <body> <table cellspacing="2" cellpadding="2" border="1"> <tbody><tr> <td>Oel ngati kemeie</td> <td>Kamakto niwin</td> </tr> <tr> <td>The ad:</td> <td> <div id="spotAd2"> <!-- Created by createNode() --> <div id="tnDiv1"> <script type="text/javascript"> google_ad_client = "pub-0321943928525350"; /* 728x90 (main top) */ google_ad_slot = "2783893649"; google_ad_width = 728; google_ad_height = 90; </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script> </div> <!-- Created by createNode() --> </div> </td> </tr> <tr> <td>txopu ra'a tsi, tsamsiyu</td> <td>teyrakup skxawng</td> </tr> </tbody></table> <!-- Created by adsense tag, need these to be under tnDiv1 --> <script src="http://pagead2.googlesyndication.com/pagead/expansion_embed.js"></script> <script src="http://googleads.g.doubleclick.net/pagead/test_domain.js"></script> <script>google_protectAndRun("ads_core.google_render_ad", google_handleError, google_render_ad);</script> <ins style="border: medium none ; margin: 0pt; padding: 0pt; display: inline-table; height: 90px; position: relative; visibility: visible; width: 728px;"> <ins style="border: medium none ; margin: 0pt; padding: 0pt; display: block; height: 90px; position: relative; visibility: visible; width: 728px;"> <iframe width="728" scrolling="no" height="90" frameborder="0" vspace="0" style="left: 0pt; position: absolute; top: 0pt;" src="http://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-0321943928525350&amp;output=html&amp;h=90&amp;slotname=2783893649&amp;w=728&amp;lmt=1273708979&amp;flash=10.0.45&amp;url=http%3A%2F%2Fkenshin.katanatechworks.com%2Ftest%2FadsBrowserSide.php&amp;dt=1273708980294&amp;shv=r20100422&amp;correlator=1273708980298&amp;frm=0&amp;ga_vid=695691836.1273708981&amp;ga_sid=1273708981&amp;ga_hid=1961182006&amp;ga_fc=0&amp;u_tz=480&amp;u_his=2&amp;u_java=1&amp;u_h=1080&amp;u_w=1920&amp;u_ah=1052&amp;u_aw=1920&amp;u_cd=24&amp;u_nplug=5&amp;u_nmime=38&amp;biw=1394&amp;bih=324&amp;fu=0&amp;ifi=1&amp;dtd=955&amp;xpc=Jl67G4xiq6&amp;p=http%3A//kenshin.katanatechworks.com" name="google_ads_frame" marginwidth="0" marginheight="0" id="google_ads_frame1" hspace="0" allowtransparency="true"> </iframe> </ins> </ins> <!-- Created by adsense tag, need these to be under tnDiv1 --> </body>

    Read the article

  • top rounded corners in my jquery

    - by Sohail
    Hello everybody, I have this jquery for my menu buttons, what I want is to get top-corner rounded for my menu, this is a whole code: <html> <style type="text/css"> #menuBarHolder { width: 860px; height:45px; background-color:#000; color:#fff; font-family:Arial; font-size:14px; margin-top:20px;} #menuBarHolder ul{ list-style-type:none; display:block;} .firstchild { border-left:1px solid #ccc;} #container { margin-top:10px;} #menuBar li{ float:left; padding:15px; height:16px; width:70px; border-right:1px solid #ccc; } #menuBar li a{color:#fff; text-decoration:none; letter-spacing:-1px; font-weight:bold;} .menuHover { background-color:#999;} .menuInfo { cursor:hand; background-color:#000; color:#fff; width:74px; font-size:11px;height:100px; padding:3px; display:none; position:absolute; margin-left:-15px; margin-top:0px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -khtml-border-radius-bottomright: 5px; -khtml-border-radius-bottomleft: 5px; border-radius-bottomright: 5px;border-radius-bottomleft: 5px; } </style> <!--[if IE]> <style type="text/css"> #menuBar li a{width:50px;} .menuInfo { margin-left:-65px; width:80px;} </style> <![endif]--> <script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#menuBar li').click(function() { var url = $(this).find('a').attr('href'); document.location.href = url; }); $('#menuBar li').hover(function() { $(this).find('.menuInfo').slideDown(); }, function() { $(this).find('.menuInfo').slideUp(); }); }); </script> <center> <div id="menuBarHolder"> <ul id="menuBar"> <li class="firstchild"><a href="javascript:#">Home</a><div class="menuInfo">I am some text about the home section</div></li> <li><a href="javascript:#">About Us</a><div class="menuInfo">I am some text about the services section</div></li> <li><a href="javascript:#">News</a><div class="menuInfo">I am some text about the clients section</div></li> <li><a href="javascript:#">Equipment</a><div class="menuInfo">I am some text about the portfolio section</div></li> <li><a href="javascript:#">Services</a><div class="menuInfo">I am some text about the about section</div></li> <li><a href="javascript:#">Project</a><div class="menuInfo">I am some text about the blog section</div></li> <li><a href="javascript:#">Contact Us</a><div class="menuInfo">I am some text about the follow section</div></li> </ul> </div> </div> </center> </html> Thanks for your help.

    Read the article

  • CSS layout changes in Internet explorer

    - by user1784103
    My problem: I just coded a website that is styled just fine in chrome and firefox. However in internet explorer(9) it breaks. the gray header background is supposed to be pushed up to the right of the logo block, and the buttons are supposed to be in the dark grey area. I posted my code. I'm no expert at css, any tips would be greatly appreciated. (the second image is displaying the desired result) the html: Website </head> <body> <div class="wrap_overall"> <div class="header"> <a href="http://localhost"> <img class="logo" src="http://localhost/images/logo.png" width="175" height="24" alt="weblogo" /> </a> </div> <div class="headerbg"></div> <!-- nav top highlight --> <div style="background-color:#6c6c6c;margin:9px0px0px;height:1px;width:1020px;z-index:1;"></div> <!-- nav bar --> <div style="background-color:#5a5a5a;height:53px;width:1020px;z-index:1;"></div> <!-- nav bottom frame --> <div style="background-color:#d4e6b6;height:13px;width:1020px;z-index:1;border-top:4px solid #9de629; margin:0px 0px 10px;"></div> <div class="nav_main"> <ul> <li> <a href="http://localhost/button1"> <img src="http://localhost/images/button1.png" width="63" height="18" alt="button1" /> </a> </li> <li> <a href="http://localhost/index.php?page=button2"> <img src="http://localhost/images/button2.png" width="59" height="18" alt="button2" /> </a> </li> <li> <a href="http://localhost/index.php?page=button3"> <img src="http://localhost/images/button3.png" width="62" height="18" alt="button3" /> </a> </li> <li> <a href="http://localhost/index.php?page=button4"> <img src="http://localhost/images/button4.png" width="41" height="18" alt="button4" /> </a> </li> <li> <a href="http://localhost/index.php?page=button5"> <img src="http://localhost/images/button5.png" width="73" height="18" alt="button5" /> </a> </li> </ul> </div> </div> </body> </html> the css: .logo { padding:60px 20px 50px 20px; } body { background-color:#282828; color:#FFFFFF; font-family: Arial, Helvetica, sans-serif; } body a, img{ border-style:none; color:#9de629; text-decoration:none;} body a:visited {color:#9de629;} body a:hover{ color:#FFFFFF; text-decoration:underline;} .wrap_overall { position:relative; width: 1020px; margin:0px auto; } .header { width:216px; height:148px; margin:0px 0px; padding:0px 0px; background-color:#252525; float:left; display:inline; } .headerbg { margin:0px 0px 0px; padding:0px 0px; width:1020px; height:148px; background-color:#c7c7c7; } .nav_main/*holds the buttons*/ { margin:0px 0px 1px 0px; padding:0px 0px 0px 0px; position:absolute; top:148px; left:363px; z-index:2; overflow: hidden; } .nav_main ul { margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; overflow: hidden; } .nav_main ul li { margin:0px 0px 0px 0px; display: inline; float: left; } .nav_main ul li a { outline: none; border:none; margin:0px 0px 0px 0px; margin-right:-10px; height:54px; width:125px; color:#FFFFFF; background-image:url(../images/button.png); text-align:center; display:table-cell; vertical-align:middle; } .nav_main ul li a:hover { background-image:url(../images/buttonlight.png); }

    Read the article

  • Cisco ASA5505 8.2 Multiple Outside IP to Multiple Inside IP

    - by GriffJ
    Trying to setup ASA5505. Semi working but having issues with accessing services from the outside. ASA5505 Basic License, Version 8.2. (plus upgrade to unlimited inside hosts). Alert: I'm a Cisco Noob. 321.321.39.X is a place holder for privacy. I came up with this config and tested it tonight. ASA Version 8.2(1) ! hostname <removed> domain-name <removed> enable password <removed> encrypted passwd <removed> encrypted names ! interface Vlan1 nameif inside security-level 100 ip address 172.21.36.1 255.255.252.0 ! interface Vlan2 nameif outside security-level 0 ip address 321.321.39.10 255.255.255.248 ! interface Ethernet0/0 switchport access vlan 2 ! interface Ethernet0/1 ! interface Ethernet0/2 ! interface Ethernet0/3 ! interface Ethernet0/4 ! interface Ethernet0/5 ! interface Ethernet0/6 ! interface Ethernet0/7 ! ftp mode passive dns server-group DefaultDNS domain-name <removed> access-list outside_inbound extended permit tcp any host 321.321.39.10 eq pptp access-list outside_inbound extended permit tcp any host 321.321.39.11 eq https access-list outside_inbound extended permit tcp any host 321.321.39.11 eq 993 access-list outside_inbound extended permit tcp any host 321.321.39.11 eq smtp access-list outside_inbound extended permit tcp any host 321.321.39.11 eq 1001 access-list outside_inbound extended permit tcp any host 321.321.39.11 eq 465 access-list outside_inbound extended permit tcp any host 321.321.39.11 eq domain access-list outside_inbound extended permit udp any eq domain host 321.321.39.11 eq domain access-list outside_inbound extended permit tcp any host 321.321.39.12 eq www access-list outside_inbound extended permit tcp any host 321.321.39.12 eq https access-list outside_inbound extended permit tcp any host 321.321.39.13 eq www access-list outside_inbound extended permit tcp any host 321.321.39.13 eq https access-list outside_inbound extended permit icmp any any echo-reply access-list outside_inbound extended permit icmp any any source-quench access-list outside_inbound extended permit icmp any any unreachable access-list outside_inbound extended permit icmp any any time-exceeded access-list outside_inbound extended permit icmp any any traceroute access-list outside_inbound extended permit icmp any any echo pager lines 24 logging asdm informational mtu inside 1500 mtu outside 1500 icmp unreachable rate-limit 1 burst-size 1 no asdm history enable arp timeout 14400 global (outside) 2 321.321.39.11-321.321.39.14 netmask 255.255.255.248 global (outside) 1 interface nat (inside) 1 0.0.0.0 0.0.0.0 static (inside,outside) tcp interface pptp 172.21.37.20 pptp netmask 255.255.255.255 static (inside,outside) 321.321.39.11 172.21.37.14 netmask 255.255.255.255 static (inside,outside) 321.321.39.12 172.21.37.24 netmask 255.255.255.255 static (inside,outside) 321.321.39.13 172.21.37.17 netmask 255.255.255.255 access-group outside_inbound in interface outside route outside 0.0.0.0 0.0.0.0 321.321.39.9 1 route inside 192.168.15.0 255.255.255.0 172.21.36.52 1 timeout xlate 3:00:00 timeout conn 1:00:00 half-closed 0:10:00 udp 0:02:00 icmp 0:00:02 timeout sunrpc 0:10:00 h323 0:05:00 h225 1:00:00 mgcp 0:05:00 mgcp-pat 0:05:00 timeout sip 0:30:00 sip_media 0:02:00 sip-invite 0:03:00 sip-disconnect 0:02:00 timeout sip-provisional-media 0:02:00 uauth 0:05:00 absolute timeout tcp-proxy-reassembly 0:01:00 dynamic-access-policy-record DfltAccessPolicy http server enable http 172.21.36.0 255.255.252.0 inside no snmp-server location no snmp-server contact snmp-server enable traps snmp authentication linkup linkdown coldstart crypto ipsec security-association lifetime seconds 28800 crypto ipsec security-association lifetime kilobytes 4608000 telnet 172.21.36.0 255.255.252.0 inside telnet timeout 60 ssh timeout 5 console timeout 0 threat-detection basic-threat threat-detection statistics access-list no threat-detection statistics tcp-intercept webvpn ! class-map inspection_default match default-inspection-traffic ! ! policy-map type inspect dns preset_dns_map parameters message-length maximum 512 policy-map global_policy class inspection_default inspect dns preset_dns_map inspect ftp inspect h323 h225 inspect h323 ras inspect rsh inspect rtsp inspect sqlnet inspect skinny inspect sunrpc inspect xdmcp inspect sip inspect netbios inspect tftp inspect pptp inspect ipsec-pass-thru inspect http ! service-policy global_policy global prompt hostname context The servers that had static forwards did not have any outside network access. couldn't ping google.com for instance. mail server couldn't Domain POP the Barracuda spam filter from our ISP etc. So after doing some reading I removed the statics for 172.21.37.11, 12 and 13, and replaced those three with what's below.. static (inside,outside) tcp 321.321.39.11 https 172.21.37.14 https netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.11 993 172.21.37.14 993 netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.11 smtp 172.21.37.14 smtp netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.11 1001 172.21.37.14 1001 netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.11 465 172.21.37.14 465 netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.11 domain 172.21.37.14 domain netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.12 www 172.21.37.24 www netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.12 https 172.21.37.24 https netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.13 www 172.21.37.17 www netmask 255.255.255.255 static (inside,outside) tcp 321.321.39.13 https 172.21.37.17 https netmask 255.255.255.255 Now the servers (for instance 172.21.37.14) could ping the outside world again. Mail started flowing (Domain POP was successful) etc. etc. But I forgot to check if webmail worked from the outside admittedly. But the webservers at 172.21.37.17 and 172.21.37.24 still didn't respond from the outside world. Although I was able to PPTP VPN in on 321.321.39.10 (interface) which is the outside interface IP address. and it is static mapped to 172.21.37.20. So I'm thinking there must be something wrong with NAT somewhere? no response from 321.321.39.11 to 321.321.39.14.. Could anyone look over the config and please let me know what I've done wrong? Is there something I've missed? well obviously but.. please help! Thank you.

    Read the article

  • Center footer fixed at the bottom IE

    - by Mirko
    I am coding a web interface for a University project and I have been dealing with this issue: I want my footer fixed at the bottom so it is in place no matter which screen I am using or if I toggle the full screen mode It works in all the other browsers except IE7 (I do not have to support previous versions) HTML <div id="menu"> <a href="information.html" rel="shadowbox;height=500;width=650" title="INFORMATION" > <img src="images/info.png" alt="information icon" /> </a> <a href="images/bricks_of_destiny.jpg" rel="shadowbox[gallery]" title="IMAGES" > <img src="images/image.png" alt="image icon" /> </a> <a href="music_player.swf" title="MUSIC" rel="shadowbox;height=400;width=600" > <img src="images/music.png" alt="music icon" /> </a> <a href="#" title="MOVIES"><img src="images/television.png" alt="movies icon" /></a> <a href="quotes.html" title="QUOTES" rel="shadowbox;height=300;width=650" > <img src="images/male_user.png" alt="male user icon" /> </a> <a href="#" title="REFERENCES"> <img src="images/search_globe.png" alt="search globe icon" /> </a> </div> <a href="images/destiny_1.jpg" rel="shadowbox[gallery]" title="IMAGES"></a> <a href="images/destiny_carma_jewell.jpg" rel="shadowbox[gallery]" title="IMAGES"></a> <a href="images/destiny-joan-marie.jpg" rel="shadowbox[gallery]" title="IMAGES"></a> <a href="images/pursuing_destiny.jpg" rel="shadowbox[gallery]" title="IMAGES"></a> <div class="clear"></div> <div id="destiny"> Discover more about the word <span class="strong">DESTINY </span>! Click one of the icon above! (F11 Toggle Full / Standard screen) </div> <div id="footer"> <ul id="breadcrumbs"> <li>Disclaimer</li> <li> | Icons by: <a href="http://dryicons.com/" rel="shadowbox">dryicons.com</a></li> <li> | Website by: <a href="http://www.eezzyweb.com/" rel="shadowbox">eezzyweb</a></li> <li> | <a href="http://jquery.com/" rel="shadowbox">jQuery</a></li> </ul> </div> </div> CSS: #wrapper{ text-align:center; margin:0 auto; width:750px; height:430px; border:1px solid #fff; } #menu{ position:relative; margin:0 auto; top:350px; width:450px; height:60px; } #destiny{ position:relative; top:380px; color:#FFF; font-size:1.5em; font-weight:bold; border:1px solid #fff; } #breadcrumbs{ list-style:none; } #breadcrumbs li{ display:inline; color:#FFF; } #footer{ position:absolute; width:750px; height:60px; margin:0 auto; text-align:center; border:1px solid #fff; bottom:0; } .clear{ clear:both; } The white borders are there only for debugging purposes The application is hosted at http://www.eezzyweb.com/destiny/ Any suggestion is appreciated

    Read the article

  • modalpopupextender.Show() wont fire

    - by Peter Lea
    I'm pretty new to developing for the web so bare with me. I have a company page with multiple locations and emails etc at each of these addresses. The idea is to have a single modalpopup to edit each type of data (one for email, one for urls, one for addresses etc). I link the modalpopupextender to a hiddenbutton and then call an edit function from various places where I can populate some hiddenfields and textboxes in the panel before showing it. The code executes but it just wont show the damn popup, I just see a flash and can't figure out if its my panel, my css or something I don't understand about ajax and postbacks etc. Things i've tried after reading various threads: Disable smart navigation in web.config Move ToolKitScriptManager up to master page and use proxy in content set hiddenbutton to use style="display:none" tried links etc instead of hidden button Heres my code CSS .modalBackground { position: absolute; z-index: 100; top: 0px; left: 0px; background-color: #000; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; } .modalPopup { background-color: #FFD; border-width: 3px; border-style: solid; border-color: gray; padding: 3px;} Asp/html <ajaxToolkit:ModalPopupExtender runat="server" ID="mpe_email" BackgroundCssClass="modalBackground" PopupControlID="modal_email" CancelControlID="btn_cancel_email" TargetControlID="fake_btn_email" /> <asp:Button ID="fake_btn_email" runat="server" Text="email" style="display:none;" /> <asp:panel id="modal_email" runat="server" class="modalPopup" Width="500px" Height="500px"> <asp:HiddenField ID="hf_modal_email_location_id" runat="server" Value="" /> <asp:HiddenField ID="hf_modal_email_contact_id" runat="server" Value="" /> <asp:HiddenField ID="hf_modal_email_comms_id" runat="server" Value="" /> <table width="100%"> <tr> <td> <asp:Label ID="lbl_mpe_email_title" runat="server" Text="Edit Email Address" /> </td> </tr> <tr> <td> <table width="100%"> <tr> <td width="40px"><img src="../images/email.png" height="30px" width="30px"/></td> <td> <table width="100px"> <tr> <td><span>Quick Ref: <asp:TextBox ID="txb_mpe_email_qref" runat="server" Text="" /></span></td> </tr> <tr> <td><span>Email Address: <asp:TextBox ID="txb_mpe_email_address_full" runat="server" Text="" /></span></td> </tr> </table> </td> </tr> </table> </td> </tr> <tr> <td width="40px" align="left"><asp:Button ID="btn_cancel_email" runat="server" Text="Cancel"/></td> <td align="right"><asp:Button ID="btn_save_email" runat="server" Text="Save" OnCommand="save_modal_email" /></td> </tr> <tr> <td colspan="2" align="right"><asp:Label ID="lbl_mpe_email_err" runat="server" Text="" /></td> </tr> </table> c# public void oloc_ocon_email_edit(object sender, RepeaterCommandEventArgs e) { switch (e.CommandName) { case "edit": hf_modal_email_location_id.Value = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_location_id")).Value; hf_modal_email_contact_id.Value = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_contact_id")).Value; hf_modal_email_comms_id.Value = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_comms_id")).Value; lbl_mpe_email_title.Text = "Edit Email Address"; txb_mpe_email_qref.Text = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_qref")).Value; txb_mpe_email_address_full.Text = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_email_full")).Value; lbl_mpe_email_err.Text = ""; mpe_email.Show(); break; case "new": hf_modal_email_location_id.Value = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_location_id_p")).Value; hf_modal_email_contact_id.Value = ((HiddenField)e.Item.FindControl("hf_oloc_ocon_emails_contact_id_p")).Value; hf_modal_email_comms_id.Value = "0"; lbl_mpe_email_title.Text = "New Email Address"; txb_mpe_email_qref.Text = ""; txb_mpe_email_address_full.Text = ""; lbl_mpe_email_err.Text = ""; mpe_email.Show(); break; } } Stuff makes so much more sense in a desktop environment, I hope someone can point me in the right direction. Thanks

    Read the article

  • Drop down menus and pathetic art of styling

    - by fmz
    Sorry folks, I must be brain-dead or something but I can't get the styling on these drop-down menus to cooperate. I have the color and the font right, but I have unwanted spaces between the list elements and the a and the a:hover sizes should be the same. I would appreciate some help getting this to work correctly. Here is the page Here is the html: <ul class="dropdown"> <li><a href="#" id="home">Home</a></li> <li><a href="#" id="about">About Us</a> <ul class="sub-menu"> <li><a href="#">Our History</a></li> <li><a href="#">Our Process</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Financing</a></li> <li><a href="#">Testimonials</a></li> <li><a href="#">Subcontractors</a></li> </ul> </li> <li><a href="#" id="personal">Personal Banking</a></li> <li><a href="#" id="commercial">Commercial Banking</a></li> <li><a href="#" id="service">Customer Service</a> <ul class="sub-menu"> <li><a href="#">Our History</a></li> <li><a href="#">Our Process</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Financing</a></li> <li><a href="#">Testimonials</a></li> <li><a href="#">Subcontractors</a></li> </ul> </li> <li><a href="#" id="investors">Investor Relations</a></li> <li><a href="#" id="contact">Contact Us</a></li> Here is the CSS: ul.dropdown { position: relative; background: #4e8997; height: 40px; padding-left: 5px; } ul.dropdown li { float: left; zoom: 1; } ul.dropdown li a ul.dropdown li a:visited { display: block; margin-top: 5px; padding: .5em .6em; line-height: 16px; color: #fff; font: bold 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; text-transform: uppercase; border: none; } ul.dropdown a:hover { background-color: #c29c5d; color: #fff; } ul.dropdown a:active { background-color: #c29c5d; color: #fff; } /* LEVEL TWO */ ul.dropdown ul { padding-left: 0; width: 200px; display: none; top:36px; margin-left: 0; position: absolute; } ul.dropdown ul li { font: 10px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; border-bottom: 1px solid #ccc; display: block; margin: 0; padding: 0; float: none; color: #fff; background-color: #c29c5d; } ul.dropdown ul li a:link { display: block; font-size: 10px; width: 188px; height: 16px; } ul.dropdown ul li a:hover { background-color: #a2834d; color: #fff; } Thanks!

    Read the article

  • How to Make a Game like Space Invaders - Ray Wenderlich (why do my space invaders scroll off screen)

    - by Erv Noel
    I'm following this tutorial(http://www.raywenderlich.com/51068/how-to-make-a-game-like-space-invaders-with-sprite-kit-tutorial-part-1) and I've run into a problem right after the part where I add [self determineInvaderMovementDirection]; to my GameScene.m file (specifically to my moveInvadersForUpdate method) The tutorial states that the space invaders should be moving accordingly after adding this piece of code but when I run they move to the left and they do not come back. I'm not sure what I am doing wrong as I have followed this tutorial very carefully. Any help or clarification would be greatly appreciated. Thanks in advance ! Here is the full GameScene.m #import "GameScene.h" #import <CoreMotion/CoreMotion.h> #pragma mark - Custom Type Definitions /* The type definition and constant definitions 1,2,3 take care of the following tasks: 1.Define the possible types of invader enemies. This can be used in switch statements later when things like displaying different sprites images for each enemy type. The typedef makes InvaderType a formal Obj-C type that is type checked for method arguments and variables.This is so that the wrong method argument is not used or assigned to the wrong variable. 2. Define the size of the invaders and that they'll be laid out in a grid of rows and columns on the screen. 3. Define a name that will be used to identify invaders when searching for them. */ //1 typedef enum InvaderType { InvaderTypeA, InvaderTypeB, InvaderTypeC } InvaderType; /* Invaders move in a fixed pattern: right, right, down, left, down, right right. InvaderMovementDirection tracks the invaders' progress through this pattern */ typedef enum InvaderMovementDirection { InvaderMovementDirectionRight, InvaderMovementDirectionLeft, InvaderMovementDirectionDownThenRight, InvaderMovementDirectionDownThenLeft, InvaderMovementDirectionNone } InvaderMovementDirection; //2 #define kInvaderSize CGSizeMake(24,16) #define kInvaderGridSpacing CGSizeMake(12,12) #define kInvaderRowCount 6 #define kInvaderColCount 6 //3 #define kInvaderName @"invader" #define kShipSize CGSizeMake(30, 16) //stores the size of the ship #define kShipName @"ship" // stores the name of the ship stored on the sprite node #define kScoreHudName @"scoreHud" #define kHealthHudName @"healthHud" /* this class extension allows you to add “private” properties to GameScene class, without revealing the properties to other classes or code. You still get the benefit of using Objective-C properties, but your GameScene state is stored internally and can’t be modified by other external classes. As well, it doesn’t clutter the namespace of datatypes that your other classes see. This class extension is used in the method didMoveToView */ #pragma mark - Private GameScene Properties @interface GameScene () @property BOOL contentCreated; @property InvaderMovementDirection invaderMovementDirection; @property NSTimeInterval timeOfLastMove; @property NSTimeInterval timePerMove; @end @implementation GameScene #pragma mark Object Lifecycle Management #pragma mark - Scene Setup and Content Creation /*This method simply invokes createContent using the BOOL property contentCreated to make sure you don’t create your scene’s content more than once. This property is defined in an Objective-C Class Extension found near the top of the file()*/ - (void)didMoveToView:(SKView *)view { if (!self.contentCreated) { [self createContent]; self.contentCreated = YES; } } - (void)createContent { //1 - Invaders begin by moving to the right self.invaderMovementDirection = InvaderMovementDirectionRight; //2 - Invaders take 1 sec for each move. Each step left, right or down // takes 1 second. self.timePerMove = 1.0; //3 - Invaders haven't moved yet, so set the time to zero self.timeOfLastMove = 0.0; [self setupInvaders]; [self setupShip]; [self setupHud]; } /* Creates an invade sprite of a given type 1. Use the invadeType parameterr to determine color of the invader 2. Call spriteNodeWithColor:size: of SKSpriteNode to alloc and init a sprite that renders as a rect of the given color invaderColor with size kInvaderSize */ -(SKNode*)makeInvaderOfType:(InvaderType)invaderType { //1 SKColor* invaderColor; switch (invaderType) { case InvaderTypeA: invaderColor = [SKColor redColor]; break; case InvaderTypeB: invaderColor = [SKColor greenColor]; break; case InvaderTypeC: invaderColor = [SKColor blueColor]; break; } //2 SKSpriteNode* invader = [SKSpriteNode spriteNodeWithColor:invaderColor size:kInvaderSize]; invader.name = kInvaderName; return invader; } -(void)setupInvaders { //1 - loop over the rows CGPoint baseOrigin = CGPointMake(kInvaderSize.width / 2, 180); for (NSUInteger row = 0; row < kInvaderRowCount; ++row) { //2 - Choose a single InvaderType for all invaders // in this row based on the row number InvaderType invaderType; if (row % 3 == 0) invaderType = InvaderTypeA; else if (row % 3 == 1) invaderType = InvaderTypeB; else invaderType = InvaderTypeC; //3 - Does some math to figure out where the first invader // in the row should be positioned CGPoint invaderPosition = CGPointMake(baseOrigin.x, row * (kInvaderGridSpacing.height + kInvaderSize.height) + baseOrigin.y); //4 - Loop over the columns for (NSUInteger col = 0; col < kInvaderColCount; ++col) { //5 - Create an invader for the current row and column and add it // to the scene SKNode* invader = [self makeInvaderOfType:invaderType]; invader.position = invaderPosition; [self addChild:invader]; //6 - update the invaderPosition so that it's correct for the //next invader invaderPosition.x += kInvaderSize.width + kInvaderGridSpacing.width; } } } -(void)setupShip { //1 - creates ship using makeShip. makeShip can easily be used later // to create another ship (ex. to set up more lives) SKNode* ship = [self makeShip]; //2 - Places the ship on the screen. In SpriteKit the origin is at the lower //left corner of the screen. The anchorPoint is based on a unit square with (0, 0) at the lower left of the sprite's area and (1, 1) at its top right. Since SKSpriteNode has a default anchorPoint of (0.5, 0.5), i.e., its center, the ship's position is the position of its center. Positioning the ship at kShipSize.height/2.0f means that half of the ship's height will protrude below its position and half above. If you check the math, you'll see that the ship's bottom aligns exactly with the bottom of the scene. ship.position = CGPointMake(self.size.width / 2.0f, kShipSize.height/2.0f); [self addChild:ship]; } -(SKNode*)makeShip { SKNode* ship = [SKSpriteNode spriteNodeWithColor:[SKColor greenColor] size:kShipSize]; ship.name = kShipName; return ship; } -(void)setupHud { //Sets the score label font to Courier SKLabelNode* scoreLabel = [SKLabelNode labelNodeWithFontNamed:@"Courier"]; //1 - Give the score label a name so it becomes easy to find later when // the score needs to be updated. scoreLabel.name = kScoreHudName; scoreLabel.fontSize = 15; //2 - Color the score label green scoreLabel.fontColor = [SKColor greenColor]; scoreLabel.text = [NSString stringWithFormat:@"Score: %04u", 0]; //3 - Positions the score label near the top left corner of the screen scoreLabel.position = CGPointMake(20 + scoreLabel.frame.size.width/2, self.size.height - (20 + scoreLabel.frame.size.height/2)); [self addChild:scoreLabel]; //Applies the font of the health label SKLabelNode* healthLabel = [SKLabelNode labelNodeWithFontNamed:@"Courier"]; //4 - Give the health label a name so it can be referenced later when it needs // to be updated to display the health healthLabel.name = kHealthHudName; healthLabel.fontSize = 15; //5 - Colors the health label red healthLabel.fontColor = [SKColor redColor]; healthLabel.text = [NSString stringWithFormat:@"Health: %.1f%%", 100.0f]; //6 - Positions the health Label on the upper right hand side of the screen healthLabel.position = CGPointMake(self.size.width - healthLabel.frame.size.width/2 - 20, self.size.height - (20 + healthLabel.frame.size.height/2)); [self addChild:healthLabel]; } #pragma mark - Scene Update - (void)update:(NSTimeInterval)currentTime { //Makes the invaders move [self moveInvadersForUpdate:currentTime]; } #pragma mark - Scene Update Helpers //This method will get invoked by update -(void)moveInvadersForUpdate:(NSTimeInterval)currentTime { //1 - if it's not yet time to move, exit the method. moveInvadersForUpdate: // is invoked 60 times per second, but you don't want the invaders to move // that often since the movement would be too fast to see if (currentTime - self.timeOfLastMove < self.timePerMove) return; //2 - Recall that the scene holds all the invaders as child nodes; which were // added to the scene using addChild: in setupInvaders identifying each invader // by its name property. Invoking enumerateChildNodesWithName:usingBlock only loops over the invaders because they're named kInvaderType; which makes the loop skip the ship and the HUD. The guts og the block moves the invaders 10 pixels either right, left or down depending on the value of invaderMovementDirection [self enumerateChildNodesWithName:kInvaderName usingBlock:^(SKNode *node, BOOL *stop) { switch (self.invaderMovementDirection) { case InvaderMovementDirectionRight: node.position = CGPointMake(node.position.x - 10, node.position.y); break; case InvaderMovementDirectionLeft: node.position = CGPointMake(node.position.x - 10, node.position.y); break; case InvaderMovementDirectionDownThenLeft: case InvaderMovementDirectionDownThenRight: node.position = CGPointMake(node.position.x, node.position.y - 10); break; InvaderMovementDirectionNone: default: break; } }]; //3 - Record that you just moved the invaders, so that the next time this method is invoked (1/60th of a second from when it starts), the invaders won't move again until the set time period of one second has elapsed. self.timeOfLastMove = currentTime; //Makes it so that the invader movement direction changes only when the invaders are actually moving. Invaders only move when the check on self.timeOfLastMove passes (when conditional expression is true) [self determineInvaderMovementDirection]; } #pragma mark - Invader Movement Helpers -(void)determineInvaderMovementDirection { //1 - Since local vars accessed by block are default const(means they cannot be changed), this snippet of code qualifies proposedMovementDirection with __block so that you can modify it in //2 __block InvaderMovementDirection proposedMovementDirection = self.invaderMovementDirection; //2 - Loops over the invaders in the scene and refers to the block with the invader as an argument [self enumerateChildNodesWithName:kInvaderName usingBlock:^(SKNode *node, BOOL *stop) { switch (self.invaderMovementDirection) { case InvaderMovementDirectionRight: //3 - If the invader's right edge is within 1pt of the right edge of the scene, it's about to move offscreen. Sets proposedMovementDirection so that the invaders move down then left. You compare the invader's frame(the frame that contains its content in the scene's coordinate system) with the scene width. Since the scene has an anchorPoint of (0,0) by default and is scaled to fill it's parent view, this comparison ensures you're testing against the view's edges. if (CGRectGetMaxX(node.frame) >= node.scene.size.width - 1.0f) { proposedMovementDirection = InvaderMovementDirectionDownThenLeft; *stop = YES; } break; case InvaderMovementDirectionLeft: //4 - If the invader's left edge is within 1 pt of the left edge of the scene, it's about to move offscreen. Sets the proposedMovementDirection so invaders move down then right if (CGRectGetMinX(node.frame) <= 1.0f) { proposedMovementDirection = InvaderMovementDirectionDownThenRight; *stop = YES; } break; case InvaderMovementDirectionDownThenLeft: //5 - If invaders are moving down then left, they already moved down at this point, so they should now move left. proposedMovementDirection = InvaderMovementDirectionLeft; *stop = YES; break; case InvaderMovementDirectionDownThenRight: //6 - if the invaders are moving down then right, they already moved down so they should now move right. proposedMovementDirection = InvaderMovementDirectionRight; *stop = YES; break; default: break; } }]; //7 - if the proposed invader movement direction is different than the current invader movement direction, update the current direction to the proposed direction if (proposedMovementDirection != self.invaderMovementDirection) { self.invaderMovementDirection = proposedMovementDirection; } } #pragma mark - Bullet Helpers #pragma mark - User Tap Helpers #pragma mark - HUD Helpers #pragma mark - Physics Contact Helpers #pragma mark - Game End Helpers @end

    Read the article

  • Why does this code generate an error? [closed]

    - by user559601
    <link rel="search" type="application/opensearchdescription+xml" href="http://b.static.ak.fbcdn.net/rsrc.php/yJ/r/H2SSvhJMJA-.xml" title="" /> <link rel="shortcut icon" href="http://static.ak.fbcdn.net/rsrc.php/y7/r/5875srnzL-I.ico" /></head> <body class="WelcomePage UIPage_LoggedOut mac Locale_en_US"> <div id="FB_HiddenContainer" style="position:absolute; top:-10000px; width:0px; height:0px;" ></div> <div id="blueBar" class="loggedOut"></div> <div id="globalContainer"><div id="dialogContainer"></div><div id="dropmenu_container"></div> <div id="content" class="fb_content clearfix"><div ><!-- 2365fa3194ecdc0cab15721ce967a9f8663937c7 --> <div class="WelcomePage_Container"><div class="loggedout_menubar_container"><div class="clearfix loggedout_menubar"><a class="lfloat" href="/" title="Go to Home"><img class="fb_logo img" src="http://static.ak.fbcdn.net/rsrc.php/yp/r/kk8dc2UJYJ4.png" alt="Facebook logo" width="170" height="36" /></a><div class="rfloat"><div class="menu_login_container"><form method="POST" action="https://login.facebook.com/login.php?login_attempt=1" id="login_form" onsubmit="return Event.__inlineSubmit(this,event)"><input type="hidden" name="charset_test" value="&euro;,&acute;,€,´,?,?,?" /><input type="hidden" name="lsd" value="hEICz" autocomplete="off" /><input type="hidden" id="locale" name="locale" value="en_US" autocomplete="off" /><table cellspacing="0"><tr><td class="html7magic"><label for="email">Email</label></td><td class="html7magic"><label for="pass">Password</label></td></tr><tr><td><input type="text" class="inputtext" name="email" id="email" tabindex="1" /></td><td><input type="password" class="inputtext" name="pass" id="pass" tabindex="2" /></td><td><label class="uiButton uiButtonConfirm"><input value="Login" tabindex="4" type="submit" /></label></td></tr><tr><td class="login_form_label_field"><input type="checkbox" class="inputcheckbox" value="1" id="persistent" name="persistent" checked="1" /><input type="hidden" name="default_persistent" value="1" /><label id="label_persistent" for="persistent">Keep me logged in</label></td><td class="login_form_label_field"><a href="http://www.facebook.com/reset.php" rel="nofollow">Forgot your password?</a></td></tr></table><input type="hidden" name="charset_test" value="&euro;,&acute;,€,´,?,?,?" /><input type="hidden" id="lsd" name="lsd" value="hEICz" autocomplete="off" /></form> </div></div></div></div><div class="WelcomePage_MainSell"><div class="WelcomePage_MainSellCenter clearfix"><div class="WelcomePage_MainSellLeft"><div class="WelcomePage_MainMessage">Facebook helps you connect and share with the people in your life.</div><div class="WelcomePage_MainMap">&nbsp;</div></div><div class="WelcomePage_MainSellRight"><div class="WelcomePage_SignUpSection"><div class="WelcomePage_SignUpMessage"><div class="WelcomePage_SignUpHeadline">Sign Up</div><div class="WelcomePage_SignUpSubheadline">It's free, and always will be.</div></div><div class="WelcomePage_SimpleReg" id="registration_container"><div><noscript><div id="no_js_box"><h2>Javascript is disabled on your browser.</h2><p>Please enable JavaScript on your browser or upgrade to a Javascript-capable browser to register for Facebook.</p></div></noscript><div id="simple_registration_container" class="simple_registration_container"><div id="reg_box"><form method="post" id="reg" name="reg" onsubmit="return function(event)&#123;return false;&#125;.call(this,event)!==false &amp;&amp; Event.__inlineSubmit(this,event)"><input type="hidden" autocomplete="off" name="post_form_id" value="c3a2bed7243b9a85f53d69f23a38da9d" /><input type="hidden" name="lsd" value="hEICz" autocomplete="off" /><input type="hidden" autocomplete="off" id="reg_instance" name="reg_instance" value="bpgeTawHFSiHa5-7SR4gbif7" /><input type="hidden" autocomplete="off" id="locale" name="locale" value="en_US" /><input type="hidden" autocomplete="off" id="terms" name="terms" value="on" /><input type="hidden" autocomplete="off" id="abtest_registration_group" name="abtest_registration_group" value="1" /><input type="hidden" autocomplete="off" id="referrer" name="referrer" value="" /><input type="hidden" autocomplete="off" id="md5pass" name="md5pass" value="" /><input type="hidden" autocomplete="off" id="validate_mx_records" name="validate_mx_records" value="1" /><input type="hidden" autocomplete="off" id="ab_test_data" name="ab_test_data" value="" /><div id="reg_form_box" class="large_form"><table class="uiGrid editor" cellspacing="0" cellpadding="1"><tbody><tr><td class="label">First Name:</td><td><div class="field_container"><input type="text" class="inputtext" id="firstname" name="firstname" /></div></td></tr><tr><td class="label">Last Name:</td><td><div class="field_container"><input type="text" class="inputtext" id="lastname" name="lastname" /></div></td></tr><tr><td class="label">Your Email:</td><td><div class="field_container"><input type="text" class="inputtext" id="reg_email__" name="reg_email__" /></div></td></tr><tr><td class="label">Re-enter Email:</td><td><div class="field_container"><input type="text" class="inputtext" id="reg_email_confirmation__" name="reg_email_confirmation__" /></div></td></tr><tr><td class="label">New Password:</td><td><div class="field_container"><input type="password" class="inputtext" id="reg_passwd__" name="reg_passwd__" value="" /></div></td></tr><tr><td class="label">I am:</td><td><div class="field_container"><div class="hidden_elem"><select><option></option><option></option></select><select><option></option><option></option></select></div><select class="select" name="sex" id="sex"><option value="0">Select Sex:</option><option value="1">Female</option><option value="2">Male</option></select></div></td></tr><tr><td class="label">Birthday:</td><td><div class="field_container"> <select class="" id="birthday_month" name="birthday_month" onchange="return run_with(this, [&quot;editor&quot;], function() &#123;editor_date_month_change(this, &quot;birthday_day&quot;, &quot;birthday_year&quot;);&#125;);"><option value="-1">Month:</option><option value="1">Jan</option>

    Read the article

  • Fixed Table Header And Scrolling Body

    - by user2881191
    can Anyone please help me with the example that is on site 'http://mkoryak.github.io/floatThead/examples/inner-scroll/' How Can i Apply the Jquery to the below example. please provide Me the Demo in JSFiddle. I Want to Make My Table Header Fixed With Scrolling (both horizontal and vertical) Body. If Possible I also need to make the last column Fixed as the Header. Please Help Me Reageding the Issue. I Have Been Stuck For a Week. Below Is My test Code For which I need to apply the style as in the above link or any other better approach. Css : #table-container{ background-color :white; overflow:auto; position:absolute; top : 0px; bottom : 18px; width : 100%; z-index: 1; } Jsp : <div id="table-container"> <table id="maintable" style="width: 100%"> <thead> <tr> <th>Col 1</th> <th>Col 2</th> <th>Col 3</th> <th>Col 4</th> <th>Col 5</th> <th>Col 6</th> <th>Col 7</th> <th>Col 8</th> <th>Col 9</th> </tr> </thead> <tbody> <tr> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> </tr> <tr> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> </tr> <tr> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> </tr> <tr> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> </tr> <tr> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> </tr> <tr> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> <td>info</td> </tr> </tbody> </table> </div>

    Read the article

  • Odd problem with IE8 and z-index CSS property

    - by DK39
    I not been able to put one DIV over his parent DIV in Internet Explorer. With Firefox is working as suposed to. The odd part is that if I open the html file directly in IE, everything works fine. But if I upload to the server and open from there, the div is hidden underneath his parent. I've tried several z-index combinations and none works. Here's the code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Test</title> <meta http-equiv="content-type" content="text-html; charset=utf-8" /> <style type="text/css"> .col { float:left; width:310px; margin-right:13px; } .art { position:relative; border-bottom: 1px solid #d0d0d0; font: normal normal bold 11px Arial,Verdana,Helvetica; color:#A0A0A0; width:310px; height:50px; top:0px; left: 0px; margin-right:10px; background-color:#F0F0F0; } .art a { padding:3px; display:block; width:304px; height:100%; color:#707070; } .art a:visited { color:#A0A0A0; } .art a:hover { background-color:#E0E0E0; } .box { z-index:1000; background-color:#A0A0A0; color:#404040; font: normal normal bold 11px Arial,Verdana,Helvetica; display:none; position:absolute; top:30px; left:10px; text-align:left; border:3px solid #707070; margin:5px 0px 5px 5px; font-size:10px; color:White; width:100%; } </style> <script type="text/javascript"> function sh(obj) { var el = document.getElementById(obj); if ( el.style.display != 'block' ) { el.style.display = 'block'; } else { el.style.display = 'none'; } } </script> </head> <body> <div class="col"> <div class="art"> <a href="" target="_blank" onmouseover="javascript:sh('i0')" onmouseout="javascript:sh('i0')">Title 1</a> <div id="i0" class="box"> <div class="text"> Les "chemises rouges" manifestent depuis la mi-mars pour faire tomber le gouvernement et occupent depuis trois semaines un quartier touristique et commerçant autour duquel ils ont érigé des barricades. </div> </div> </div> <div class="art"> <a href="" target="_blank" onmouseover="javascript:sh('i1')" onmouseout="javascript:sh('i1')">Title2</a> <div id="i1" class="box"> <div class="text"> Une association ardéchoise accueillant des séminaires de "bien-être" et de "développement personnel" a refusé d'accueillir un stage de danse en invoquant l'homosexualité des participants, ont indiqué aujourd'hui les organisateurs. </div> </div> </div> </div> </body> </html> What's is going on here?

    Read the article

  • Need help getting DIV inside DIV to stretch to width of contents in Firefox

    - by bj.
    I am using a layout similar to the one from Dynamic Drive here: http://www.dynamicdrive.com/style/layouts/item/css-right-frame-layout/ The main content area (white) has overflow set to auto. I have given the innerTube inside this main content area a border. However if the contents within this innerTube are greater than the width of the main content area, a horizontal scroll bar will appear as expected, but in Firefox these contents will 'overlap' the border and go off screen (can be retrieved by scrolling horizontally). In other words, the right hand border remains in place, and the content just goes over the op of it, and disappears behind the right hand column. In IE it behaves exactly as I want - the content pushes the border off screen to be visible only once you scroll over there. I guess the easiest thing is to paste the source code here. If you copy it into a blank file you'll see what I mean. I've just used one really long word to replicate what happens if a wide image is there instead. Thanks in advance to anyone who can help me out. <!--Force IE6 into quirks mode with this comment tag--> <!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" lang="en" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"> body{ margin: 0; padding: 0; border: 0; overflow: hidden; height: 100%; max-height: 100%; } #framecontent{ position: absolute; top: 0; bottom: 0; right: 0; width: 200px; /*Width of frame div*/ height: 100%; overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/ background: #cccccc; color: white; } #maincontent{ position: fixed; top: 0; left: 0; right: 200px; /*Set right value to WidthOfFrameDiv*/ bottom: 0; overflow: auto; background: #fff; } .innertube{ margin: 15px; /*Margins for inner DIV inside each DIV (to provide padding)*/ } .innertubeWithBorder { margin: 15px; border: solid 1px #666666; } * html body{ /*IE6 hack*/ padding: 0 200px 0 0; /*Set value to (0 WidthOfFrameDiv 0 0)*/ } * html #maincontent{ /*IE6 hack*/ height: 100%; width: 100%; } </style> </head> <body> <div id="framecontent"> <div class="innertube"> <h1>CSS Right Frame Layout</h1> <h3>Sample text here</h3> </div> </div> <div id="maincontent"> <div class="innertubeWithBorder"> <h1>Dynamic Drive CSS Library</h1> <p>AReallyLongWordWhichIsSimilarToHavingAnImageWithWidthGreaterThanTheWidthOfThisDivToShowOverFlowProblemWithBorderSoIfYouResizeThisWindowNarrowerYouWillSeeWhatIMeanWorksFineInIEButNotFirefox</p> <p>So I want that border over there ------> to dissappear behind the right hand column like it does in IE, and be visible once you use the scrollbar below and scroll to the right</p> <p style="text-align: center">Credits: <a href="http://www.dynamicdrive.com/style/">Dynamic Drive CSS Library</a></p> </div> </div> </body> </html>

    Read the article

  • Patching this Code to apply dynamic (iPhone) background position

    - by Brian
    I posted a question previously that got off topic, I'm reposting with better code that I have VERIFIED is compatible with iPhone (it works with mine anyway!) I just want to apply background-position coordinates to the body element and call the script conditionally for iPhone, iPod, & iPad. Here's my conditional call for those devices: var deviceAgent = navigator.userAgent.toLowerCase(); var agentID = deviceAgent.match(/(iphone|ipod|ipad)/); if (agentID) { // do something } else { //do this } Now, I've found this excellent script that sets the "top: x" dynamically on the basis of scroll position. Everyone has told me (and ALL of the tutorials and Google search results as well) that it's impossible to set scroll position dynamically for iPhone because of the viewport issue. HOWEVER, they are wrong because if you scroll to the bottom of the page and view this javascript demo on iPhone, you can scroll and the <div style="background-position: fixed; top: x (variable)"></div> div DOES stay centered on iPhone. I really hope this question helps alot of people, I thought it was impossible, but it's NOT... I just need help stitching it together! The original code (you can test it on iPhone yourself) is here: http://stevenbenner.com/2010/04/calculate-page-size-and-view-port-position-in-javascript/ So I just need help getting the following code to apply the dynamic "background-position: 0 x" to the BODY tag where x is centered and relative to the viewport position. Also, needs to be nested inside the above code that is conditional for iPhone and similar devices. // Page Size and View Port Dimension Tools // http://stevenbenner.com/2010/04/calculate-page-size-and-view-port-position-in-javascript/ if (!sb_windowTools) { var sb_windowTools = new Object(); }; sb_windowTools = { scrollBarPadding: 17, // padding to assume for scroll bars // EXAMPLE METHODS // center an element in the viewport centerElementOnScreen: function(element) { var pageDimensions = this.updateDimensions(); element.style.top = ((this.pageDimensions.verticalOffset() + this.pageDimensions.windowHeight() / 2) - (this.scrollBarPadding + element.offsetHeight / 2)) + 'px'; element.style.left = ((this.pageDimensions.windowWidth() / 2) - (this.scrollBarPadding + element.offsetWidth / 2)) + 'px'; element.style.position = 'absolute'; }, // INFORMATION GETTERS // load the page size, view port position and vertical scroll offset updateDimensions: function() { this.updatePageSize(); this.updateWindowSize(); this.updateScrollOffset(); }, // load page size information updatePageSize: function() { // document dimensions var viewportWidth, viewportHeight; if (window.innerHeight && window.scrollMaxY) { viewportWidth = document.body.scrollWidth; viewportHeight = window.innerHeight + window.scrollMaxY; } else if (document.body.scrollHeight > document.body.offsetHeight) { // all but explorer mac viewportWidth = document.body.scrollWidth; viewportHeight = document.body.scrollHeight; } else { // explorer mac...would also work in explorer 6 strict, mozilla and safari viewportWidth = document.body.offsetWidth; viewportHeight = document.body.offsetHeight; }; this.pageSize = { viewportWidth: viewportWidth, viewportHeight: viewportHeight }; }, // load window size information updateWindowSize: function() { // view port dimensions var windowWidth, windowHeight; if (self.innerHeight) { // all except explorer windowWidth = self.innerWidth; windowHeight = self.innerHeight; } else if (document.documentElement && document.documentElement.clientHeight) { // explorer 6 strict mode windowWidth = document.documentElement.clientWidth; windowHeight = document.documentElement.clientHeight; } else if (document.body) { // other explorers windowWidth = document.body.clientWidth; windowHeight = document.body.clientHeight; }; this.windowSize = { windowWidth: windowWidth, windowHeight: windowHeight }; }, // load scroll offset information updateScrollOffset: function() { // viewport vertical scroll offset var horizontalOffset, verticalOffset; if (self.pageYOffset) { horizontalOffset = self.pageXOffset; verticalOffset = self.pageYOffset; } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict horizontalOffset = document.documentElement.scrollLeft; verticalOffset = document.documentElement.scrollTop; } else if (document.body) { // all other Explorers horizontalOffset = document.body.scrollLeft; verticalOffset = document.body.scrollTop; }; this.scrollOffset = { horizontalOffset: horizontalOffset, verticalOffset: verticalOffset }; }, // INFORMATION CONTAINERS // raw data containers pageSize: {}, windowSize: {}, scrollOffset: {}, // combined dimensions object with bounding logic pageDimensions: { pageWidth: function() { return sb_windowTools.pageSize.viewportWidth > sb_windowTools.windowSize.windowWidth ? sb_windowTools.pageSize.viewportWidth : sb_windowTools.windowSize.windowWidth; }, pageHeight: function() { return sb_windowTools.pageSize.viewportHeight > sb_windowTools.windowSize.windowHeight ? sb_windowTools.pageSize.viewportHeight : sb_windowTools.windowSize.windowHeight; }, windowWidth: function() { return sb_windowTools.windowSize.windowWidth; }, windowHeight: function() { return sb_windowTools.windowSize.windowHeight; }, horizontalOffset: function() { return sb_windowTools.scrollOffset.horizontalOffset; }, verticalOffset: function() { return sb_windowTools.scrollOffset.verticalOffset; } } };

    Read the article

< Previous Page | 102 103 104 105 106 107 108 109  | Next Page >