Search Results

Search found 6781 results on 272 pages for 'src src'.

Page 252/272 | < Previous Page | 248 249 250 251 252 253 254 255 256 257 258 259  | Next Page >

  • random quote generator with php, ajax and mysql

    - by fusion
    i've tried using this code and this to make a random quote generator, but it doesn't display anything. my questions are: what is wrong with my code? in the above tut, the quote is generated on a button click, i'd like a random quote to be displayed every 30 mins automatically. how do i do this? //////////////////////// quote.html: <!DOCTYPE html> <script src="ajax.js" type="text/javascript"></script> <body> <!–create the div for the quotes land–> <div id="quote"><strong>this</strong></div> <div><a style="cursor:pointer" onclick="run_query();">Next quote …</a></div> </body> </html> ///////////////////// quote.php: <?php include 'config.php'; // 'text' is the name of your table that contains // the information you want to pull from $rowcount = mysql_query("select count(*) as rows from quotes"); // Gets the total number of items pulled from database. while ($row = mysql_fetch_assoc($rowcount)) { $max = $row["rows"]; } // Selects an item's index at random $rand = rand(1,$max)-1; $result = mysql_query("select * from quotes limit $rand, 1"); $row = mysql_fetch_array($result); $randomOutput = $row['storedText']; echo '<p>' . $randomOutput . '</p>'; //////////// ajax.js: var xmlHttp function run_query() { xmlHttp=GetXmlHttpObject(); if (xmlHttp==null) { alert ("This browser does not support HTTP Request"); return; } // end if var url="quote.php"; xmlHttp.onreadystatechange=stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); } //end function function stateChanged(){ if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ document.getElementById("quote").innerHTML=xmlHttp.responseText; } //end if } //end function function GetXmlHttpObject() { var xmlHttp=null; try { // For these browsers: Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); }catch (e){ //For Internet Explorer try{ xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } //end function

    Read the article

  • Setting background-image with javascript

    - by Mattoe3k
    In chrome, safari, and opera setting the background image to an absolute reference such as: "/images/image.png" changes it to "http://sitepath/images/image.png". It does not do this in firefox. Is there any way to avoid this behavior, or is it written into the browser's javascript engine? Using jquery to set the background-image also does this problem. The problem is that I am posting the HTML to a php script that needs the urls in this specific format. I know that setting the image path relative fixes this, but I can't do that. The only other alternative would be to use a regexp. to convert the urls. Thanks. Test this in firefox, and chrome / webkit browser: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <div style="height:400px;width:400px;background-image:url(/images/images/logo.gif);"> </div> <br /> <br /> <div id="test" style="height:400px;width:400px;"> </div> <script type="text/javascript" src="/javascripts/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#test").css('background-image',"url(/images/images/logo.gif)"); alert(document.getElementById('test').style.backgroundImage); }); </script> </body> </html>

    Read the article

  • jQuery multiple class selection

    - by morpheous
    I am a bit confused with this: I have a page with a set of buttons (i.e. elements with class attribute 'button'. The buttons belong to one of two classes (grp1 and grp2). These are my requirements For buttons with class enabled, when the mouse hovers over them, a 'button-hover' class is added to them (i.e. the element the mouse is hovering over). Otherwise, the hover event is ignored When one of the buttons with class grp2 is clicked on (it has to be 'enabled' first), then I disable (i.e. remove the 'enabled' class for all elements with class 'enabled' (should probably selecting for elements with class 'button' AND 'enabled' - but I am having enough problems as it is, so I need to keep things simple for now). This is what my page looks like: <html> <head> <title>Demo</title> <style type="text/css" .button {border: 1px solid gray; color: gray} .enabled {border: 1px solid red; color: red} .button-hover {background-color: blue; } </style> <script type="text/javascript" src="jquery.js"></script> </head> <body> <div class="btn-cntnr"> <span class="grp1 button enabled">button 1</span> <span class="grp2 button enabled">button 2</span> <span class="grp2 button enabled">button 3</span> <span class="grp2 button enabled">button 4</span> </div> <script type="text/javascript"> /* <![CDATA[ */ $(document).ready(function(){ $(".button.enabled").hover(function(){ $(this).toggleClass('button-hover'); }, function() { $(this).toggleClass('button-hover'); }); $('.grp2.enabled').click(function(){ $(".grp2").removeClass('enabled');} }); /* ]]> */ </script> </body> </html> Currently, when a button with class 'grp2' is clicked on, the other elements with class 'grp2' have the 'enabled' class removed (works correctly). HOWEVER, I notice that even though the class no longer have a 'enabled' class, SOMEHOW, the hover behaviour is still applied to these elemets (WRONG). Once an element has been 'disabled', I no longer want it to respond to the hover() event. How may I implement this behavior, and what is wrong with the code above (i.e. why is it not working? (I am still learning jQuery)

    Read the article

  • Add class to elements which already have a class

    - by bwstud
    I have a group of divs which I'm dynamically generating when a button is clicked with the class, "brick". This gives them dimension and starting position of top: 0. I'm trying to get them to animate to the bottom of the view using a css transition with a second class assignment which gives them a bottom position: 0;. Can't figure out the syntax for adding a second class to elements with a pre-existing class. On inspection they only show the original class of, "brick". HTML <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <meta charset="utf-8"> <title>JS Bin</title> </head> <body> <div id="container"> <div id="button" >Click Me</div> </div> </body> </html> CSS #container { width: 100%; height: 100vh; padding: 10vmax; } #button { position: fixed; } .brick { position: relative; top: 0; height: 10vmax; width: 20vmax; background: white; margin: 0; padding: 0; transition: all 1s; } .drop { transition: all 1s; bottom 0; } The offending JS: var brickCount = function() { var count = prompt("How many boxes you lookin' for?"); for(var i=0; i < count; i++) { var newBrick = document.createElement("div"); newBrick.className="brick"; document.querySelector("#container") .appendChild(newBrick); } }; var getBricks = function(){ document.getElementByClass("brick"); }; var changeColor = function(){ getBricks.style.backgroundColor = '#'+Math.floor(Math.random()*16777215).toString(16); }; var addDrop = function() { getBricks.brick = "getBricks.brick" + " drop"; }; var multiple = function() { brickCount(); getBricks(); changeColor(); addDrop(); }; document.getElementById("button").onclick = function() {multiple();}; Thanks!

    Read the article

  • How to make item view render rich (html) text in PyQt?

    - by Giorgio Gelardi
    I'm trying to translate code from this thread in python: import sys from PyQt4.QtCore import * from PyQt4.QtGui import * __data__ = [ "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.", "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.", "Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." ] def get_html_box(text): return '''<table border="0" width="100%"><tr width="100%" valign="top"> <td width="1%"><img src="softwarecenter.png"/></td> <td><table border="0" width="100%" height="100%"> <tr><td><b><a href="http://www.google.com">titolo</a></b></td></tr> <tr><td>{0}</td></tr><tr><td align="right">88/88/8888, 88:88</td></tr> </table></td></tr></table>'''.format(text) class HTMLDelegate(QStyledItemDelegate): def paint(self, painter, option, index): model = index.model() record = model.listdata[index.row()] doc = QTextDocument(self) doc.setHtml(get_html_box(record)) doc.setTextWidth(option.rect.width()) painter.save() ctx = QAbstractTextDocumentLayout.PaintContext() ctx.clip = QRectF(0, option.rect.top(), option.rect.width(), option.rect.height()) dl = doc.documentLayout() dl.draw(painter, ctx) painter.restore() def sizeHint(self, option, index): model = index.model() record = model.listdata[index.row()] doc = QTextDocument(self) doc.setHtml(get_html_box(record)) doc.setTextWidth(option.rect.width()) return QSize(doc.idealWidth(), doc.size().height()) class MyListModel(QAbstractListModel): def __init__(self, parent=None, *args): super(MyListModel, self).__init__(parent, *args) self.listdata = __data__ def rowCount(self, parent=QModelIndex()): return len(self.listdata) def data(self, index, role=Qt.DisplayRole): return index.isValid() and QVariant(self.listdata[index.row()]) or QVariant() class MyWindow(QWidget): def __init__(self, *args): super(MyWindow, self).__init__(*args) # listview self.lv = QListView() self.lv.setModel(MyListModel(self)) self.lv.setItemDelegate(HTMLDelegate(self)) self.lv.setResizeMode(QListView.Adjust) # layout layout = QVBoxLayout() layout.addWidget(self.lv) self.setLayout(layout) if __name__ == "__main__": app = QApplication(sys.argv) w = MyWindow() w.show() sys.exit(app.exec_()) Element's size and position are not calculated correctly I guess, perhaps because I haven't understand at all the style related parts from original code. Can someone help me?

    Read the article

  • Can't figure out the color of an svg element

    - by yass
    I have a very simple HTML page, viewable on gh-pages with the following code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link href="style.css" media="screen" rel="stylesheet" type="text/css"> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'> </script> </head> <body> <div id="page"> <div id="content"> <div id="heatmap"> <svg style="margin-left: 80px; color: rgb(255, 255, 255);" width="800" height="880"> <g transform="translate(80,80)"> <rect style="color: rgb(255, 255, 255);" height="720" width="720"> </rect> </g> </svg> </div> </div> </div> </body> </html> with the following CSS: body { background-color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #FFFFFF; } #wrapper { margin: 0 auto; padding: 0; } #page { width: 1000px; margin: 0 auto; padding: 40px 0px 0px 0px; } #content { float: left; width: 660px; padding: 0px 0px 0px 0px; background: #FFFFFF; } I expect the rectangle, 'svg rect' to be the color #FFFFFF, or white. But it shows up as some other color. I opened it up in firebug, and it shows the computed color to be #FFFFF:

    Read the article

  • Why doesn't the .click() not work in this instance?

    - by Deshiknaves
    Basically what this does is fadeIn pre-existing divs and then loads an image. When the image is loaded it then appends that into one of the pre-existing divs. Then it appends a new div with an id of xButton. Then later it $('#xButton').click() should hide the 3 divs. However it just doesn't work. If I change the click() to either #modalImage or #overlay, it works but just not for the #xButton. I would really like to figure out why its not working and how I should be doing this instead. Thanks. $(function(){ $('#container a').click(function(e){ e.preventDefault(); var id = $(this).attr('href'), img = new Image(); $('#overlay').fadeIn(function(){ $('#modalImage').fadeIn(); }); $(img).load(function(){ $(this).hide(); $('#modalImage').removeClass('loader').append(this); $(this).fadeIn(function(){ var ih = $(this).outerHeight(), iw = $(this).outerWidth(), newH = ($(window).height()/10)*7, newW = ($(window).width()/10)*7; if (ih >= iw && ih >= newH) { $(this).css('height',newH + 'px'); $(this).css('width', 'auto'); } else if (ih >= iw && newH > ih) { $(this).css('height', ih + 'px'); $(this).css('width', 'auto'); } else if (iw > ih && iw >= newW) { if ((newW / (iw / ih)) > newH) { $(this).css('width', 'auto'); $(this).css('height', newH + 'px'); } else { $(this).css('width', newW + 'px'); $(this).css('height', 'auto'); } } else { $(this).css('width', iw + 'px'); $(this).css('height', 'auto'); } var padW = ($(window).width() - $(this).outerWidth()) / 2, padH = ($(window).height() - $(this).outerHeight()) / 2; console.log (padH + ' ' + padW); $(this).css('top', padH); $(this).css('left', padW); if($('#overlay').is(":visible") == true) { ih = ih + 4; $('<div id="xButton">x</div>').appendTo('#modalImage'); if (padH >= 0) { $('#xButton').css('top', padH - 4).css('right', padW - 65); } else { $('#xButton').css('top', '20px').css('right', padW - 65); } } }); }).attr('src', id); }); $('#xButton').click(function(){ $(this).hide(); $('#overlay').fadeOut(function(){ $('#modalImage img').css('top', '-9999px').remove(); $('#xButton').remove(); $('#modalImage').addClass('loader'); }); }); });

    Read the article

  • json null error help in php

    - by bobby
    I get 'json is null' as error My php file: <?php if (isset($_REQUEST['query'])) { $query = $_REQUEST['query']; $url='https://www.googleapis.com/urlshortener/v1/'; $key='ApiKey'; $result= $url.($query).$key; $ch = curl_init($result); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,1); $resp = curl_exec($ch); curl_close($ch); echo $resp; } ?> My html: <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ // when the user clicks the button $("button").click(function(){ $.getJSON("shortner.php?query="+$('#query').attr("value"),function(json){ $('#results').append('<p>Id : ' + json.id+ '</p>'); $('#results').append('<p>Longurl: ' + json.longurl+ '</p>'); }); }); }); </script> </head> <body> <input type="text" value="Enter a place" id="query" /><button>Get Coordinates</button> <div id="results"></div> Edited : <?php if (isset($_REQUEST['query'])) { $query = $_REQUEST['query']; $url='https://www.googleapis.com/urlshortener/v1/'; $key='Api'; $key2='?key='; $result= $url.$query.$key2.$key; $requestData= json_encode($result); echo var_dump($query); $ch = curl_init($requestData); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,1); $resp = curl_exec($ch); curl_close($ch); echo $resp; } ?>

    Read the article

  • How to display image from server (newest-oldest) to a new php page?

    - by Jben Kaye
    i have a form that create images and save it on a folder in the server. What i need to do is to display ALL created images to another page, the newest on the top and so that the oldest is at the bottom. i have a form called formdisplay.php but it's just displaying a broken image and not newest to oldest. hope you can help me with this. really need to get this working. thanks in advance for your help. i have read the posts but none of those worked for me. Pull dedicated images from folder - show image + filename (strip part of filename + file-extension) How can I display latest uploaded image first? (PHP+CSS) getting images from the server and display them Displaying images from folder in php display image from server embedding php in html formcreatesave.php imagecopymerge($im, $img2, 10, 350, 0, 0, imagesx($img2), imagesy($img2), 100); $date_created = date("YmdHis");//get date created $img_name = "-img_entry.jpg"; //the file name of the generated image $img_newname = $date_created . $img_name; //datecreated+name $img_dir =dirname($_SERVER['SCRIPT_FILENAME']) ."/". $img_newname; //the location to save imagejpeg($im, $img_dir , 80); //function to save the image with the name and quality imagedestroy($im); formdisplay.php $dir = '/home3/birdieon/public_html/Amadeus/uploader/uploader'; $base_url = 'http://birdieonawire.com/Amadeus/uploader/uploader/20131027024705-img_entry.jpg'; $newest_mtime = 0; $show_file = 'BROKEN'; if ($handle = opendir($dir)) { while (false !== ($file = readdir($handle))) { if (($file != '.') && ($file != '..')) { $mtime = filemtime("$dir/$file"); if ($mtime > $newest_mtime) { $newest_mtime = $mtime; $show_file = "$base_url/$file"; } } } } print '<img src="' .$show_file. '" alt="Image Title Here">'; please feel free to edit my code. thanks :)

    Read the article

  • CSS Ease-in-out to full screen

    - by Aditya Singh
    I have a black background div of a size which contains an image. <div id="Banner"> <img onclick="expand();" src="hola.jpg"> </div> #Banner { position:relative; height:50px; width:50px; margin:0 auto; background-color:#000000; -webkit-transition: all 0.5s ease-in-out 0.5s; -moz-transition: all 0.5s ease-in-out 0.5s; -o-transition: all 0.5s ease-in-out 0.5s; transition: all 0.5s ease-in-out 0.5s; } <script type="text/javascript"> function expand(){ document.getElementById('Banner').style['height'] = '250'; document.getElementById('Banner').style['width'] = '250'; } </script> So when the user clicks on the image, the div transitions to 250, 250. My problem is that, i want it to to transition to full screen. The following javascript function does expand to fullscreen but the transition effect doesn't come. I need to do it from a javascript code without jquery. function expand(){ document.getElementById('Banner').style['position'] = 'absolute'; document.getElementById('Banner').style['height'] = '100%'; document.getElementById('Banner').style['width'] = '100%'; document.getElementById('Banner').style['top'] = '0'; document.getElementById('Banner').style['left'] = '0'; } Please advice. Update : Solution Roger below has provided with an alternative solution. This takes care if the document has already been scrolled and is another place. Will expand the div to full browser screen. sz=getSize(); //function returns screen width and height in pixels currentWidth=200; currentHeight=200; scalex=sz.W/currentWidth; scaley=sz.H/currentHeight; transx=0-((expandingDiv.offsetLeft+(currentWidth/2))-(sz.W/2))+document.body.scrollLeft; transy=0-((expandingDiv.offsetTop+(cuttentHeight/2))-(sz.H/2))+document.body.scrollTop; transx = transx.toString(); transy = transy.toString(); document.getElementById("Banner").style['-webkit-transform'] = 'translate('+transx+'px,'+transy+'px) scale('+scalex+','+scaley+')';

    Read the article

  • Serialize JavaScript's navigator object

    - by kappa
    Hi, I'm creating a page to help diagnose the problem our users are experiencing with our web pages (you know, asking a user "What browser are you using?" usually leads to "Internet"). This page already submits to me all the HTTP headers and now I'm trying to have JavaScript give some more informations, so I thought it would be great to have the user's navigator JavaScript object and I started looking how to serialize it so I can submit it through a form. The problem is I'm not able to serialize the navigator object using any JSON library I know of, everyone returns an empty object (?!), so I decided to write an ad-hoc serializer. You can find the code here: <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> function serialize (object) { var type = typeof object; if (object === null) { return '"nullValue"'; } if (type == 'string' || type === 'number' || type === 'boolean') { return '"' + object + '"'; } else if (type === 'function') { return '"functionValue"'; } else if (type === 'object') { var output = '{'; for (var item in object) { if (item !== 'enabledPlugin') { output += '"' + item + '":' + serialize(object[item]) + ','; } } return output.replace(/\,$/, '') + '}'; } else if (type === 'undefined') { return '"undefinedError"'; } else { return '"unknownTypeError"'; } }; $(document).ready(function () { $('#navigator').text(serialize(navigator)); }); </script> <style type="text/css"> #navigator { font-family: monospaced; } </style> <title>Serialize</title> </head> <body> <h1>Serialize</h1> <p id="navigator"></p> </body> </html> This code seems to work perfectly in Firefox, Opera, Chrome and Safari but (obviously) doesn't work in Internet Explorer (at least version 8.0), it complains that "Property or method not supported by the object" at line for (var item in object) {. Do you have any hint on how to fix the code or how to reach the goal (serialize the navigator object) by other means?

    Read the article

  • AJAX: Problems returning multiple variables

    - by fwaokda
    First off sorry if I'm missing something simple just started working with AJAX today. I have an issue where I'm trying to get information from my database, but different records have different amounts of values. For instance, each record has a "features" column. In the features column I store a string. (ex: Feature1~Feature2~Feature3~Feature4... ) When I'm building the object I take apart the string and store all the features into an array. Some objects can have 1 feature others can have up to whatever. So... how do I return this values back to my ajax function from my php page? Below is my ajax function that I was trying and I'll provide a link with my php file. [ next.php : http://pastebin.com/SY74jV7X ] $("a#next").click(function() { $.ajax({ type : 'POST', url : 'next.php', dataType : 'json', data : { nextID : $("a#next").attr("rel") }, success : function ( data ) { var lastID = $("a#next").attr("rel"); var originID = $("a#next").attr("rev"); if(lastID == 1) { lastID = originID; } else { lastID--; } $("img#spotlight").attr("src",data.spotlightimage); $("div#showcase h1").text(data.title); $("div#showcase h2").text(data.subtitle); $("div#showcase p").text(data.description); $("a#next").attr("rel", lastID); for(var i=0; i < data.size; i++) { $("ul#features").append("<li>").text(data.feature+i).append("</li>"); } /* for(var j=1; j < data.picsize; j++) { $("div.thumbnails ul").append("<li>").text(data.image+j).append("</li>"); } */ }, error : function ( XMLHttpRequest, textStatus, errorThrown) { $("div#showcase h1").text("An error has occured: " + errorThrown); } }); });

    Read the article

  • Custom cell in list in Flash AS3

    - by Stian Flatby
    I am no expert in Flash, and I need some quick help here, without needing to learn everything from scratch. Short story, I have to make a list where each cell contains an image, two labels, and a button. List/Cell example: img - label - label - button img - label - label - button As a Java-programmer, I have tried to quicly learn the syntax and visualness of Flash and AS3, but with no luck so far. I have fairly understood the basics of movie clips etc. I saw a tutorial on how to add a list, and add some text to it. So I dragged in a list, and in the code went list.addItem({label:"hello"}); , and that worked ofc. So i thought if I double-clicked the MC of the list, i would get to tweak some things. In there I have been wandering around different halls of cell-renderers etc. I have now come to the point that I entered the CellRenderer_skinUp or something, and customized it to my liking. When this was done, I expected i could use list.addItem(); and get an empty "version" of my cell, with the img, labels and the button. But AS3 expects an input in addItem. From my object-oriented view, I am thinking that i have to create an object of the cell i have made, but i have no luck reaching it.. I tried to go var test:CellRenderer = list.listItem; list.addItem(test); ..But with no luck. This is just for funsies, but I really want to make this work, however not so much that I am willing to read up on ALOT of Flash and AS3. I felt that I was closing in on the prize, but the compiler expected a semicolon after the variable (list.addItem({test:something});). Note: If possible, I do NOT want this: list.addItem({image:"src",label:"text",label"text",button:"text"}); Well.. It actually is what I want, but I would really like to custom-draw everything. Does anyone get what I am trying to do, and has any answers for me? Am I approaching this the wrong way? I have searched the interwebs for custom list-cells, but with no luck. Please, any guiding here is appreciated! Sti

    Read the article

  • jQuery UI problem: why do the elements go flying around the screen?

    - by George Edison
    Yes, I know the title sounds a little suspicious. I will try to explain this the best I can... The code below is supposed to have the blue div slide down beside the red div. The first time you hit the Show the div button, it works. Also, the Hide the div works. Then when I click to show the div again, it appears to the right of where it is supposed to be! Why is this?!? Note: You can find a live example of the code here <html> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Demo</title> <style type='text/css'> #red { background-color: red; width: 200px; height: 150px; position: absolute; } #blue { background-color: blue; width: 150px; height: 200px; position: absolute; display: none; } #tester_1 { top: 300px; left: 300px; position: absolute; } #tester_2 { top: 350px; left: 300px; position: absolute; } </style> </head> <script type="text/javascript" src="jquery.js"></script> <script type='text/javascript'> function Show() { $('#blue').position({ of: $('#red'), my: 'left top', at: 'right top'}).slideDown(); } function Hide() { $('#blue').hide(); } </script> <body> <div id='red'></div> <div id='blue'></div> <button id='tester_1' onclick='Show()'>Show the <kbd>div</kbd></button> <button id='tester_2' onclick='Hide()'>Hide the <kbd>div</kbd></button> </body> </html>

    Read the article

  • Eclipse javascript character encoding

    - by Bardock
    Hi, I'd like to display some language specific characters from javascript but I can't. My app is a Java webapp and the front end is jQuery. All the characters that are sended from the server - in a JSP or with AJAX - are displayed properly. When I want to display some text hardcoded in to the javascript file it's broken. I'm using Eclipse. In the JSP's header I use: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> I've tried this (charset in the script element) too: <script type="text/javascript" charset="utf-8"><c:import url="/JS/mainJS.js" /></script> In my Eclipse I've set the project properties / text file encoding to UTF-8 AND I've checked the JS files' resource properties / text file encoding that is UTF-8 too. But when I try this: $.test = function(){ var s = "éééáááuuuu"; alert(s); } I get: éééáááűűűű The strange thing is that: When I try in a separate html file (in the same project), It's working: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Test</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <style type="text/css"> body {background: #c0c0c0;} </style> <script type="text/javascript"> $(document).ready(function(){ var s = "éááuuúúú"; $("#console").text(s); alert(s); }) </script> </head> <body> <div id="console"></div> </body> </html> Even if I DO NOT use any content type and page encoding settings. What is the problem? What shall I do? (I'm using Apache Tomcat integrated in Eclipse) Thanks in advance!

    Read the article

  • Converting this code from ASP to PHP

    - by jethomas
    I'll admit I'm a novice programmer and really the only experience I have is in classic ASP. I'm looking for a way to convert this asp code to PHP. For a customer who only has access to a linux box but also as a learning tool for me. Thanks in advance for the help: Recordset and Function: Function pd(n, totalDigits) if totalDigits > len(n) then pd = String(totalDigits-len(n),"0") & n else pd = n end if End Function 'declare the variables Dim Connection Dim Recordset Dim SQL Dim SQLDate SQLDate = Year(Date)& "-" & pd(Month(Date()),2)& "-" & pd(Day(Date()),2) 'declare the SQL statement that will query the database SQL = "SELECT * FROM tblXYZ WHERE element_8 = 2 AND element_9 > '" & SQLDate &"'" 'create an instance of the ADO connection and recordset objects Set Connection = Server.CreateObject("ADODB.Connection") Set Recordset = Server.CreateObject("ADODB.Recordset") 'open the connection to the database Connection.Open "PROVIDER=MSDASQL;DRIVER={MySQL ODBC 5.1 Driver};SERVER=localhost;UID=xxxxx;PWD=xxxxx;database=xxxxx;Option=3;" 'Open the recordset object executing the SQL statement and return records Recordset.Open SQL,Connection Display page/loop: Dim counter counter = 0 While Not Recordset.EOF counter = counter + 1 response.write("<div><td width='200' valign='top' align='center'><a href='" & Recordset("element_6") & "' style='text-decoration: none;'><div id='ad_header'>" & Recordset("element_3") & "</div><div id='store_name' valign='bottom'>" & Recordset("element_5") & "</div><img id='photo-small-img' src='http://xyz.com/files/" & Recordset("element_7") & "' /><br /><div id='ad_details'>"& Recordset("element_4") & "</div></a></td></div>") Recordset.MoveNext If counter = 3 Then Response.Write("</tr><tr>") counter = 0 End If Wend

    Read the article

  • Facebook Connect from Localhost, doing some weird stuff

    - by Brett
    So maybe the documentation is out of date, or I am just off here. But I have done a slew of FB iframe apps (connect), but I am starting my first FB Connect site. Running it from localhost, and the Connect URL is http:// my_external_IP_address. When I click on the FB login button on my site, it pops up, says waiting for facebook, and it returns my site in that box, with the URL up top with the http:// mysite/?session={session key, user_id, etc.} The user_id is infact my FB id. And so it thinks I am logged in. If I close the popup, I'm not logged in. I'm not sure why the pop up isn't doing the normal fb connect dialog. I'm following these steps. (I added spaces to the http:// as to not be detected as 'spam') html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" right after <body> <script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"> At the end, before the body close tag: script type="text/javascript"> FB.init("fbkey", "http://127.0.0.1/xd_receiver.htm"); I have tried using xd_receiver.htm, /xd_receiver.htm (and other combos), and that brings up a blank page. using the http://127.0.0.1 at least does something. In my config file, which is called before all of those, it checks for a PHP session key to see if they are logged in, if that doesn't exist it looks for a cookie, and if that doesn't exist it does this: require_once('includes/facebook.php'); $facebook = new Facebook($fbkey, $fbsec); $user_id = $facebook->get_loggedin_user(); if($user_id > 0){ $user = $ac->getUserFromFB($user_id); $_SESSION['user_id'] = $user['user_id']; } The user_id is always empty when I echo it out to the screen to test. The session event never occurs as well. So I don't know what it is doing in the popup, but I think Facebook thinks it is logging me in. Not sure. Pretty stumped on this one. Any help would be appreciated. Thanks!

    Read the article

  • Javascript table construction bug using JQuery in Firefox on Mac OSX

    - by Poita_
    I'm using some code to build up tables using JQuery, but in Firefox 3.5.3 on Mac OSX, the table cells all appear on separate lines by themselves, instead of in their respective rows. Chrome 5.0.342.7 beta on OSX correctly produces the table, as does Safari 4.0.5. Here is a minimal reproduction case: <html> <body> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { var b = $('body'); b.append("<table>"); for (var i = 0; i < 3; ++i) { b.append("<tr>"); for (var j = 0; j < 3; ++j) b.append("<td>x</td>"); b.append("</tr>"); } b.append("</table>"); }); </script> </body> </html> In Chrome and Safari, I get this correct output: x x x x x x x x x but Firefox produces: x x x x x x x x x Note that if I manually create that exact table without using Javascript (i.e. direct into the HTML) then the table appears correctly in Firefox. Also, if I change the JS to append then entire table in one call then it also works -- the only time it doesn't work is if you append it part-by-part as I have done before. My question is: is this to be expected, or should I report this as a bug to Firefox? I'm pretty sure this is a Firefox bug, but I'm a bit of a newbie to JS and web development in general, so perhaps there's something I'm missing? P.S. obviously there are easy ways to get around this -- that's not my concern. See above.

    Read the article

  • jquery load a specific #Div content from multiple html files

    - by Vikram
    Hello friends I am trying to make a Content Slider for my site. I have multiple HTML files and the structure of these files is like this: <div id="title"><h2>Title of the Slide</h2></div> <div id="image"><a href="http://mylink.com"><img src="image.jpg" width="600" height="300" alt="image"</a></div> <div id="content">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</div> I have been trying to use the following script get content (but no success): <?php function render($position="") { ob_start(); foreach(glob("/slides/*.html") as $fileName) { $fname = basename( $fileName ); $curArr = file($fname); $slides[$fname ]['title'] = $curArr[0]; $slides[$fname ]['image'] = $curArr[1]; $slides[$fname ]['content'] = $curArr[2]; foreach($slides as $key => $value){ ?> <div id="slide-title"> <?php echo $value['title'] ?> </div> <div id="slide-content"> <?php echo $value['image'] ?> </div> <div id="slide-image"> <?php echo $value['content'] ?> </div> <?php }} ?> <?php return ob_get_clean(); } But then I came to know about a jQuery function.... (again no success) jQuery.noConflict(); (function($){ $(document).ready(function () { $('#slide-title').load('slides/slide1.html #title'); $('#slide-content').load('slides/slide1.html #content'); $('#slide-image').load('slides/slide1.html #image'); }); })(jQuery); Now My questions are..... Am I using the right syntax. How do I get the content from multiple files using jQuery. Please Note : My knowledge on Programming is almost '0'. I have just started learning it.

    Read the article

  • Facebook PHP SDK - can't pass parameters to getLoginUrl()

    - by Elliott
    I'm using the Facebook PHP SDK for simple login with extended permissions. I'm using the example code from the SDK docs, but I found that I need to manually clear out the FB session data otherwise if($user) comes back as true even though the user is logged out. I have the app going to logout.php upon logout; this page clears out the session vars and redirects to the app home page. Once I clear out the FB session data, log in/log out works fine. However, it stops working if I pass $params to the getLoginUrl function. Once I pass any params (I've tried several), the login breaks, either by not bringing up the second extended permissions screen or by refreshing the app page w/out login success. index page and logout page code follow. index.php <?php require 'services/facebook-php-sdk/src/facebook.php'; $facebook = new Facebook(array( 'appId' => '[APP_ID]', 'secret' => '[SECRET]', )); // Get User ID $user = $facebook->getUser(); if($user) { try { // Proceed knowing you have a logged in user who's authenticated. $user_profile = $facebook->api('/me'); $params = array('next' => 'http://'.$_SERVER["SERVER_NAME"].'/logout.php'); $logout_url = $facebook->getLogoutUrl($params); } catch (FacebookApiException $e) { error_log($e); $user = null; } } else { $login_url = $facebook->getLoginUrl($params = array('redirect_uri' => 'http://'.$_SERVER["SERVER_NAME"].'/', 'scope' => 'read_stream')); } ?> <!DOCTYPE html> <html lang="en"> <head> </head> <body> <?php if($user) { ?> <p><a href="<?php echo($logout_url); ?>">Log out</a></p> <?php } else { ?> <p><a href="<?php echo($login_url); ?>">Log in</a></p> <?php } ?> </body> </html> logout.php <?php session_start(); $fb_app_id = '[APP_ID]'; unset($_SESSION['fb_'.$fb_app_id.'_code']); unset($_SESSION['fb_'.$fb_app_id.'_access_token']); unset($_SESSION['fb_'.$fb_app_id.'_user_id']); unset($_SESSION['fb_'.$fb_app_id.'_state']); header('Location: http://'.$_SERVER["SERVER_NAME"].'/'); ?>

    Read the article

  • Navbar Menu Trouble shoot

    - by Nabeel M
    So I wanted to create the fixed nav bar on top of the page. Instead of creating nav bar with ordered list, I used the following approach: <header> <div class="nav"> <img src="images/logo_ab.png" alt="AurinBioTech Logo"/> <a href="index.html">Home</a> <a href="#">About</a> <a href="#">Team</a> <a href="#">Science</a> <a href="#">Need</a> <a href="#">Pipeline</a> <a href="#">Contact</a> </div> </header> CSS: header .nav { margin-top:100px; width:100%; height:10%; text-align:center; padding-top:2%; margin:0 auto; position:fixed; top:0; } header .nav a { font-size: 2em; padding-left: 15px; padding-right: 15px; color:rgb(1, 1, 1); text-decoration: none; font-family: 'Bebas'; } header .nav a:hover { color:white; background-color: #404040; border-radius:5px; padding:0 auto; } header .nav a:active{ background-color: #404040; border-radius:5px; text-decoration:overline; } header .nav img { width:260px; height:65px; padding-right:4em; } The reason I used this approach is because I wanted to use logo image next to the nav bar so it would align properly in the same line. Now the problem is that I need to add sub-menus under Science and Pipeline heading. Since I didn't use UL or LI, how can I add sub-menus under those heading. OR, can you tell me any other way to create a NAV bar that shows the logo as well. so it would be LOGO and MENUS on the same line. Great thanks in advance.

    Read the article

  • Showing div based on filled form field

    - by Fabio
    I have this script where I use a slider to show some elements of a form. So far so good. The way I'm doing it is by having a slider (can't use a multistep form since it uses a plugin not allowing multistep forms, plus some graphic behaviors) and a button that goes to the next slider. So now I need that button (not part of the form) to show only if a certain field is filled. I tried teh following, but it's not working, I assume some error but can't figure what. My code is as follows: $('#clientname').change(function() { var clientVal = $("input").val() == ''; $(".next").hide(); if ($('#clientname').val() != '').show(); else $('.next').hide(); }); and the html as follows: <div class="b40-right"> <h3>The Basics</h3> <div class="label"> Your Name (required)</div> <div class="inputes"> <span class="wpcf7-form-control-wrap your-name"><input id="clientname" type="text" name="your-name" value="" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" size="40" /></span> </div> <div class="label">Your Email (required)</div> <div class="inputes"> <span class="wpcf7-form-control-wrap your-email"><input type="text" name="your-email" value="" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" size="40" /></span> </div> <div class="label">Type of Business</div> <div class="inputes"> <span class="wpcf7-form-control-wrap type-of-business"><textarea name="type-of-business" class="wpcf7-form-control wpcf7-textarea" cols="40" rows="10"></textarea></span> </div> </div> <a class="next" href="javascript:stepcarousel.stepBy('mygallery2', 1)"><img id="nextbut1" src="<?php bloginfo('template_directory'); ?>/images/next.png" alt="" /></a> any help on what am I doing wrong? Is there a better approach/solution? (I'm not a programmer as you may figure) Thank you in advance!

    Read the article

  • Cocoa WebView won't render all images on OSX 10.8

    - by user2906962
    I'm currently developing an application for OS X, backwards compatible with OS X 10.6. At some point I create a WebView in which I load html content that I create dynamically. The html content is formed only of image links <img src= and text, there is no javascript or anything of that kind. All the images (there are only 5 png images) are stored locally and their size is 4 KB. The problem I have is that some images (those that are not on the visible side of the "scroll"), the very first time I run the application,the images are not shown unless I drag the window to another screen or load again the view controller that contains the WebView. In those cases the images appear on the "scroll" even if they are offsite. I've tried creating the WebView both with IB and programatically, I've used WebPreferences like Autosaves, AllowsAnimatedImages … I've tried using NSURLCache to load each image so that the WebView will get access to them easier ... same result. Taking into account that my code is quite extensive I'm gonna post only the bits that I think are relevant: NSString *finalHtml ... //contains the complete html CGRect screenRect = [self.fixedView bounds]; CGRect webFrame = CGRectMake(0.0f, 0.0f, screenRect.size.width, screenRect.size.height); self.miwebView=[[WebView alloc] initWithFrame:webFrame]; [self.miwebView setEditable:NO]; [self.miwebView setUIDelegate:self]; ... NSURLCache *URLCache = [[NSURLCache alloc] initWithMemoryCapacity:4 * 1024 * 1024 diskCapacity:20 * 1024 * 1024 diskPath:nil]; [NSURLCache setSharedURLCache:URLCache]; NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"line" ofType:@"png"]; NSURL *resourceUrl = [NSURL URLWithString:imagePath]; NSURLRequest *request = [NSURLRequest requestWithURL:resourceUrl cachePolicy:NSURLRequestUseProtocolCachePolicy timeoutInterval:10.0f]; [URLCache cachedResponseForRequest:request]; ... [self.miwebView setResourceLoadDelegate:self]; WebPreferences *webPref = [[WebPreferences alloc]init]; [webPref setAutosaves:YES]; [webPref setAllowsAnimatedImages:YES]; [webPref setAllowsAnimatedImageLooping:YES]; [self.miwebView setPreferences:webPref]; NSString *pathResult = [[NSBundle mainBundle] bundlePath]; NSURL *baseURLRes = [NSURL fileURLWithPath:pathResult]; [[self.miwebView mainFrame] loadHTMLString:finalHtml baseURL:baseURLRes]; [self.fixedView addSubview:self.miwebView]; I should also mention that if an image is caught somewhere in between the visible and non visible side of the "scroll" only the visible bit of the image is going to be rendered even if the page gets scrolled up ... so I think all this is some rendering issue ... I appreciate your help, thank you!

    Read the article

  • jQuery replacing an image inside a .net datalist

    - by user359409
    (submit said I was trying to post an image so I've changed image everywhere to ix I am trying to get jQuery to replace an ix inside a datalist. The original ix is the thumbnail ix of a product on a category page. The small ix I am clicking on are swatch ix for the different colors of a product. I can get it to work using a div tag around the ix tag inside the ItemTemplate. I don't need to use a div tag if I can get the imagesx to swap- I was just using it because that is sample code I found and it works for the first product in the category. <asp:HyperLink ID="ProductNav" runat="server" NavigateUrl='<%#Eval("NavigateUrl") %>'> <div id="ladiv" runat="server"> <asp:Ixx runat="server" ID="ProdThumb" /> </div> </asp:HyperLink> <asp:PlaceHolder ID="phSwatches" runat="server"></asp:PlaceHolder> The ProdThumb ix is added from the code behind and the swatches are added from the code behind swatches.Controls.Add(new LiteralControl("<table><tr>")); foreach(OptionChoice optionChoice in option.Choices) { string swatchThumbnail = string.Format("<ix ID=\"{0}\" src=\"{1}\" border=\"0\" class=\"{2}\" />","swatch" + optionChoice.OptionChoiceId.ToString(), ResolveUrl(optionChoice.ThumbnailUrl),"imgthumb"); swatches.Controls.Add(new LiteralControl("<td>")); swatches.Controls.Add(new LiteralControl(swatchThumbnail)); swatches.Controls.Add(new LiteralControl("</td>")); } swatches.Controls.Add(new LiteralControl("</tr></table>")); prodThumb.IxUrl = product.ThumbnailUrl; prodThumb.AlternateText = product.ThumbnailAltText; prodThumb.CssClass = "Thumbnail"; The jQuery is: $(function() { $("ix.imgthumb").click(function(e) { var t = $(this); var newImg = ''; $('#ladiv') .html($(newImg) ); }); }); </script> Both images are named similar, except the swatch contains "sws" and the larger one is the some only with "swl". I have spent several days searching but am not able to get it to work. If I try something like $("#<%=ladiv.ClientID %") the code can't find it. I appreciate any help.

    Read the article

  • driver.findElement() with iframe and elements without ID

    - by user1864657
    Java Code: driver.switchTo().frame(0); WebElement elemText = driver.findElement(By.xpath("/html/body[contains(@class='forum')]")); //WebElement elemText = driver.findElement(By.xpath("//td[@id='cke_contents_vB_Editor_001_editor']/textarea")); elemText.sendKeys(message); elemText.submit(); forumLink = driver.getCurrentUrl(); HTML Code: <td id="cke_contents_vB_Editor_001_editor" class="cke_contents" style="height:1726px" role="presentation"> <iframe style="width:100%;height:100%" frameborder="0" title="Rich text editor, vB_Editor_001_editor, press ALT 0 for help." src="" tabindex="-1" allowtransparency="true"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html dir="ltr" lang="en" contenteditable="true"> <head> <title data-cke-title="Rich text editor, vB_Editor_001_editor, press ALT 0 for help.">Rich text editor, vB_Editor_001_editor, press ALT 0 for help.</title> <base href="http://fairplay.garena.com/" data-cke-temp="1"> <link type="text/css" rel="stylesheet" href="http://fairplay.garena.com/clientscript/vbulletin_css/style00008l/editor_contents.css"> <style type="text/css" data-cke-temp="1"> form{border: 1px dotted #FF0000;padding: 2px;} img.cke_hidden{background-image: url(http://fairplay.garena.com/clientscript/ckeditor/plugins/forms/images/hiddenfield.gif?t=B37D54V);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 16px !important;height: 16px !important;} img.cke_iframe{background-image: url(http://fairplay.garena.com/clientscript/ckeditor/plugins/iframe/images/placeholder.png?t=B37D54V);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 80px;height: 80px;} img.cke_anchor{background-image: url(http://fairplay.garena.com/clientscript/ckeplugins/vblink/images/anchor.gif?t=B37D54V);background-position: center center;background-repeat: no-repeat;border: 1px solid #a9a9a9;width: 18px !important;height: 18px !important;} a.cke_anchor{background-image: url(http://fairplay.garena.com/clientscript/ckeplugins/vblink/images/anchor.gif?t=B37D54V);background-position: left center;background-repeat: no-repeat;border: 1px solid #a9a9a9;padding-left: 18px;} </style> </head> <body class="forum" spellcheck="true"> </body> </html> </iframe> </td> Image: http://s9.postimage.org/nwyvq3san/Screen_Shot038.jpg I can't find a way to get elements inside a iframe and without id. Can you help me?

    Read the article

< Previous Page | 248 249 250 251 252 253 254 255 256 257 258 259  | Next Page >