Search Results

Search found 3623 results on 145 pages for 'alt'.

Page 135/145 | < Previous Page | 131 132 133 134 135 136 137 138 139 140 141 142  | Next Page >

  • dynamically embedding youtube videos with jquery

    - by danwoods
    Hello all, I'm trying to retrieve a listing of a user's youtube videos and embed them in a page using jQuery. My code looks something like this: $(document).ready(function() { //some variables var fl_obj_template = $('<object width="260" height="140">' + '<param name="movie" value=""></param>' + '<param name="allowFullScreen" value="true"></param>' + '<param name="allowscriptaccess" value="always"></param>' + '<embed src="" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="260" height="140"></embed>' + '</object>'); var video_elm_arr = $('.video'); //hide videos until ready $('.video').addClass('hidden'); //pull video data from youtube $.ajax({ url: 'http://gdata.youtube.com/feeds/api/users/username/uploads?alt=json', dataType: 'jsonp', success: function(data) { $.each(data.feed.entry, function(i,item){ //only take the first 7 videos if(i > 6) return; //give the video element a flash object var cur_flash_obj = fl_obj_template; //assign title $(video_elm_arr[i]).find('.video_title').html(item.title.$t); //clean url var video_url = item.media$group.media$content[0].url; var index = video_url.indexOf("?"); if (index > 0) video_url = video_url.substring(0, index); //and asign it to the player's parameters $(cur_flash_obj).find('object param[name="movie"]').attr('value', video_url); $(cur_flash_obj).find('object embed').attr('src', video_url); //alert(cur_flash_obj); //insert flash object in video element $(video_elm_arr[i]).append(cur_flash_obj); //and show $(video_elm_arr[i]).removeClass('hidden'); }); } }); }); (of course with 'username' being the actual username). The video titles appear correctly but no videos show up. What gives? The target html looks like: <div id="top_row_center" class="video_center video"> <p class="video_title"></p> </div>

    Read the article

  • UpdatePanel Full Postback

    - by Korivo
    Greetings, here is the scenario. I have and .aspx page with and updatepanel like this <asp:UpdatePanel id="uPanelMain" runat="server"> <ContentTemplate> <uc:Calendar id="ucCalendar" runat="server" Visible="true" /> <uc:Scoring id="ucScoring" runat="server" Visible="false" /> </ContentTemplate> The control ucCalendar is loaded first and it contains a grid like this <asp:DataGrid CssClass="grid" ID="gridGames" runat="server" AutoGenerateColumns="False" HeaderStyle-CssClass="gridHeader" ItemStyle-CssClass="gridScoringRow" GridLines="None" ItemStyle-BackColor="#EEEEEE" AlternatingItemStyle-BackColor="#F5F5F5" OnEditCommand="doScoreGame" OnDeleteCommand="doEditGame" OnCancelCommand="printLineup" OnItemDataBound="gridDataBound"> <Columns> <asp:TemplateColumn > <ItemTemplate> <asp:CheckBox ID="chkDelete" runat="server" /> </ItemTemplate> </asp:TemplateColumn> <asp:BoundColumn DataField="idGame" Visible="false" /> <asp:BoundColumn DataField="isClose" Visible="false" /> <asp:TemplateColumn HeaderText="Status"> <ItemTemplate> <asp:Image ID="imgStatus" runat="server" ImageUrl="~/img/icoX.png" alt="icoStatus" /> </ItemTemplate> </asp:TemplateColumn> <asp:TemplateColumn> <ItemTemplate> <asp:LinkButton ID="linkScore" runat="server" CommandName="Edit" Text="Score" /> </ItemTemplate> </asp:TemplateColumn> </Columns> </asp:DataGrid> So when i click the "linkButton", the codebehind of the userControl calls a public method in the .aspx as this: From the userControl protected void doScoreGame(object sender, DataGridCommandEventArgs e) { ((GM)this.Page).showScoring(null, null); } From the .aspx page public void showScoring(object sender, EventArgs e) { removeLastLoadedControl(); ucScoring.Visible = true; } So, here comes the problem: There are two postbacks taking place when I change the visible attribute of the ucScoring control. The first postback is fine, it's handled by the updatePanel. The second postback is a full postback, and i really don't understand why it is happening. I'm really lost here, please help! Thanks Mat

    Read the article

  • Elements added with appendTo() not immediately available

    - by Zip Gun Jim
    I'm having a problem with elements added with appendTo() not being immediately available in the DOM. First, I'm reading some data from a JSON file and then appending some html to a div. jsonUrl = "js/performers.json"; $.getJSON(jsonUrl, function(json) { $.each(json.performers, function(i, performer) { var html = '<div class="performer_mini">'; html += '<img src="' + performer.thumbnail + '" alt="' + performer.name + '" /><br />'; html += performer.name + '<br /></div>'; $(html).appendTo("div#performer_spotlight"); }); }); Then I'm calling a random shuffler plugin to show one of the added divs at a time. $("#performer_spotlight").randomShuffler(".performer_mini", 3000, 3000, 9000); The random shuffler does the following: (function($) { $.fn.randomShuffler = function(shuffledElements, fadeInTime, fadeOutTime, timeout) { fadeInTime = fadeInTime || 3000; fadeOutTime = fadeOutTime || 3000; timeout = timeout || 9000; $(shuffledElements).hide(); var $old_element; var $new_element; var old_index = 0; var new_index = 0; function shuffleElement() { $old_element = $new_element; old_index = new_index; while ($(shuffledElements).length > 0 && old_index == new_index) { // don't display the same element twice in a row new_index = Math.floor(Math.random()*$(shuffledElements).length); } $new_element = $(shuffledElements + ":eq(" + new_index + ")"); if ($old_element != undefined) { $old_element.fadeOut(fadeOutTime, function() { $new_element.fadeIn(fadeInTime); }); } else { $new_element.fadeIn(fadeInTime); } setTimeout(shuffleElement, timeout); } $(this).show(); shuffleElement(); } })(jQuery); The first time the shuffleElement() function is called $(shuffledElements).length equals 0, so no element is displayed. On the next call to shuffleElement(), the elements added with appendTo() are available and one is selected at random as expected. Everything works correctly after that. Is there some way to refresh the DOM or make these elements available to jQuery immediately after I add them with appendTo()? Any other suggestions for how to accomplish this?

    Read the article

  • JSP to Bean to Java class Validation

    - by littlevahn
    I have a rather simple form in JSP that looks like this: <form action="response.jsp" method="POST"> <label>First Name:</label><input type="text" name="firstName" /><br> <label>Last Name:</label><input type="text" name="lastName" /><br> <label>Email:</label><input type="text" name="email" /><br> <label>Re-enter Email:</label><input type="text" name="emailRe" /><br> <label>Address:</label><input type="text" name="address" /><br> <label>Address 2:</label><input type="text" name="address2" /><br> <label>City:</label><input type="text" name="city" /><br> <label>Country:</label> <select name="country"> <option value="0">--Country--</option> <option value="1">United States</option> <option value="2">Canada</option> <option value="3">Mexico</option> </select><br> <label>Phone:</label><input type="text" name="phone" /><br> <label>Alt Phone:</label><input type="text" name="phoneAlt" /><br> <input type="submit" value="submit" /> </form> But when I try and access the value of the select box in my Java class I get null. Ive tried reading it in as a String and an Array of strings neither though seems to be grabbing the right value. The response.jsp looks like this: <%@ page language="java" %> <%@ page import="java.util.*" %> <%@page contentType="text/html" pageEncoding="UTF-8"%> <%! %> <jsp:useBean id="formHandler" class="validation.RegHandler" scope="request"> <jsp:setProperty name="formHandler" property="*" /> </jsp:useBean> <% if (formHandler.validate()) { %> <jsp:forward page="success.jsp"/> <% } else { %> <jsp:forward page="retryReg.jsp"/> <% } %> I already have Java script validation in place but I wanted to make sure I covered validation and checking for non-JS users. The RegHandler just uses the name field to refer to the value in the form. Any Idea how I could access the select box's value?

    Read the article

  • Pass param to a silverlight application

    - by Lucas_Santos
    In my javascript I create my <OBJECT> tag var htmlEmbedSilverlight = "<div id='silverlightControlHost'> " + "<object data='data:application/x-silverlight-2,' type='application/x-silverlight-2' width='550px' height='250px'> " + "<param name='source' value='../../ClientBin/FotoEmprestimoChave.xap'/> " + "<param name='onError' value='onSilverlightError' /> " + "<param name='background' value='white' /> " + "<param name='minRuntimeVersion' value='4.0.60310.0' /> " + "<param name='autoUpgrade' value='true' /> " + "<param name='initparams' values='chave_id=" + data + "' /> " + "<a href='http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.60310.0' style='text-decoration:none'> " + "<img src='http://go.microsoft.com/fwlink/?LinkId=161376' alt='Get Microsoft Silverlight' style='border-style:none'/> " + "</a> " + "</object><iframe id='_sl_historyFrame' style='visibility:hidden;height:0px;width:0px;border:0px'></iframe></div>"; $("#tiraFotoSilverlight").html(htmlEmbedSilverlight); This is a reference to my Silverlight application where I call in my Web Application. The problem is my <param name='initparams' values='chave_id=" + data + "' /> " because in my App.xaml in Silverlight, I have the code below private void Application_Startup(object sender, StartupEventArgs e) { if (e.InitParams != null) { foreach (var item in e.InitParams) { this.Resources.Add(item.Key, item.Value); } } this.RootVisual = new MainPage(); } Where InitParams always has Count = 0 and I don't know why. Can someone help me ? I'm just trying to pass a value to my Silverlight application, without a PostBack. Rendered <object width="550px" height="250px" type="application/x-silverlight-2" data="data:application/x-silverlight-2,"> <param value="../../ClientBin/FotoEmprestimoChave.xap" name="source"> <param value="onSilverlightError" name="onError"> <param value="white" name="background"> <param value="4.0.60310.0" name="minRuntimeVersion"> <param value="true" name="autoUpgrade"> <param values="chave_id=1" name="initparams"> <a style="text-decoration:none" href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.60310.0"> </object>

    Read the article

  • How to know there is something in the cell or not ?

    - by Harikrishna
    I have table like below in the html file: <table border="1"> <tr> <td>BuyQuantity</td><td>SellQuantity</td> </tr> <tr> <td>15D</td><td>&nbsp;<span style="font-family: &quot;Arial Unicode MS&quot;;"><o:p></o:p></span></p></td> </tr> <tr> <td>&nbsp;<span style="font-family: &quot;Arial Unicode MS&quot;;"><o:p></o:p></span></td><td>38D</td> </tr> <tr> <td>&nbsp;<span style="font-family: &quot;Arial Unicode MS&quot;;"><o:p></o:p></span></td><td>99D</td> </tr> <tr> <td>38D</td><td>&nbsp;<span style="font-family: &quot;Arial Unicode MS&quot;;"><o:p></o:p></span></td> </tr> </table> There are two columns: buy-quantity and sell-quantity.(It is only example but in each html file there is different content in the table.) Now with the content of these two columns I want to decide there is items bought or items sold.Like in the first row there is 15d buy-qauntity then items were bought and in the second row there is 38d sell-qauntity then items were sold and so on. And after deciding there is items-bought or items-sold I want to build one column named buy/sell for this table like below: ![alt text][1] [1]: http://C:\Documents and Settings\Administrator\My Documents\My Pictures\untitled.png How can I do this ?

    Read the article

  • How to change the JSON output format and how to support chinese character?

    - by sky
    Currently I using the following code to get my JSON output from MySQL. <?php $session = mysql_connect('localhost','name','pass'); mysql_select_db('dbname', $session); $result= mysql_query('SELECT message FROM posts', $session); $somethings = array(); while ($row = mysql_fetch_assoc($result)) { $somethings[] = $row; } ?> <script type="text/javascript"> var somethings= <?php echo json_encode($somethings); ?>; </script> And the output is: <script type="text/javascript"> var somethings= [{"message":"Welcome to Yo~ :)"},{"message":"Try iPhone post!"},{"message":"????"}]; </script> Here is the question, how can I change my output into format like : <script type="text/javascript"> userAge = new Array('21','36','20'), userMid = new Array('liuple','anhu','jacksen'); </script> Which I'll be using later with following code : var html = ' <table class="map-overlay"> <tr> <td class="user">' + '<a class="username" href="/' + **userMid[index]** + '" target="_blank"><img alt="" src="' + getAvatar(signImgList[index], '72x72') + '"></a><br> <a class="username" href="/' + **userMid[index]** + '" target="_blank">' + userNameList[index] + '</a><br> <span class="info">' + **userSex[index]** + ' ' + **userAge[index]** + '?<br> ' + cityList[index] + '</span>' + '</td> <td class="content">' + picString + somethings[index] + '<br> <span class="time">' + timeList[index] + picTips + '</span></td> </tr> </table> '; Thanks for helping and reading!

    Read the article

  • Configuring a html page from an original demo page

    - by Wold
    I forked into rainyday.js through github, an awesome javascript program made by maroslaw at this link: https://github.com/maroslaw/rainyday.js. Basically I tried taking his demo page and my own photo city.jpg and changed the applicable fields so that I could run it on my own site, but only the picture loads and the script itself doesn't start to run. I'm pretty new to html and javascript so I'm probably omitting something very simple, but here is the script for the demo code: <script src="rainyday.js"></script> <script> function getURLParameter(name) { return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,''])[1].replace(/\+/g, '%20'))||null; } function demo() { var image = document.getElementById('background'); image.onload = function () { var engine = null; var preset = getURLParameter('preset') || '1'; if (preset === '1') { engine = new RainyDay({ element: 'background', blur: 10, opacity: 1, fps: 30, speed: 30 }); engine.rain([ [1, 2, 8000] ]); engine.rain([ [3, 3, 0.88], [5, 5, 0.9], [6, 2, 1] ], 100); } else if (preset === '2') { engine = new RainyDay({ element: 'background', blur: 10, opacity: 1, fps: 30, speed: 30 }); engine.VARIABLE_GRAVITY_ANGLE = Math.PI / 8; engine.rain([ [0, 2, 0.5], [4, 4, 1] ], 50); } else if (preset === '3') { engine = new RainyDay({ element: 'background', blur: 10, opacity: 1, fps: 30, speed: 30 }); engine.trail = engine.TRAIL_SMUDGE; engine.rain([ [0, 2, 0.5], [4, 4, 1] ], 100); } }; image.crossOrigin = 'anonymous'; if (getURLParameter('imgur')) { image.src = 'http://i.imgur.com/' + getURLParameter('imgur') + '.jpg'; } else if (getURLParameter('img')) { image.src = getURLParameter('img') + '.jpg'; } var youtube = getURLParameter('youtube'); if (youtube) { var div = document.getElementById('sound'); var player = document.createElement('iframe'); player.frameborder = '0'; player.height = '1'; player.width = '1'; player.src = 'https://youtube.com/embed/' + youtube + '?autoplay=1&controls=0&showinfo=0&autohide=1&loop=1'; div.appendChild(player); } } </script> This is where I am naming my background and specifying the photo from within the directory. <body onload="demo();"> <div id="sound" style="z-index: -1;"></div> <div id="parent"> <img id='background' alt="background" src="city.jpg" /> </div> </body> The actual code for the whole entire rainyday.js script can be found here: https://github.com/maroslaw/rainyday.js/blob/master/rainyday.js Thanks in advance for any help and advice!

    Read the article

  • Having problems creating an array from XML data in Acrobat Javascript, please help if you can

    - by Kevin Minke
    I have a manually created array that already works example below: var PartsData = { 179: { ref:"", partNum: "201-2007-C00-00", descript: "System Monitor Card (Tracewell Only)", cage: "39764", qty: "1", SMR: "XBOZZ", UOC: "A" }}; Now this array above is is just one value in the array and it works fine. Here is the XML that I am trying to use to dynamically change the values. <?xml version="1.0" encoding="utf-8"?> <partsTables> <partsList> <part sheetNum="ta1"> <breakDownIndexNo>-1 </breakDownIndexNo> <referenceDesg/> <indent>20534220P01 </indent> <description/> <cage>TAC RI, GRADE-A SHOCK (TEC RACK), ALT P/N 72304-1</cage> <qtyPerAssy>23991 </qtyPerAssy> <smr>1 </smr> <uoc>ADODD </uoc> <blank/> </part> </partsList> </partsTables> I have this parsing just fine in Acrobat. Now I want to make the array work for me in using these values. if I have the following below it will work. Where part.item(i).indent.value equals the value of the indent node, etc. newArr = { 179: { ref: part.item(i).referenceDesg.value, partNum: part.item(i).indent.value, descript: part.item(i).cage.value, cage: part.item(i).qtyPerAssy.value, qty: part.item(i).smr.value, SMR: part.item(i).uoc.value, UOC: part.item(i).blank.value}}; As soon as I try to make the 179 value, which is in the breakDownIndexNo node, dynamic by using the direct part.item(i).breakDownIndexNo.value it will not compile. Acrobat is using javascript so I'm not sure why I can not get this to parse. I have tried to create a variable out of the breakDownIndexNo node and typed it to both a String and an Integer. this will let it create the array but it will not let me output from the array. newArr[indexNum].partNum gives me "no properties" where newArr[179].partNum if I were to manually set the index number to 179 will print out the value of part.item(i).indent.value. If any of you have an idea or an answer please let me know.

    Read the article

  • php database image show problem

    - by Termedi
    here is the code <?php session_start(); if(!isset($_SESSION['user_name'])) { header('Location: login.php'); } $conn = mysql_connect("localhost", "root", "") or die("Can no connect to Database Server"); ?> <html> <head> </head> <body> <center> <div id="ser"> <form action="" method="post"> <label for="file">Card No:</label> <input type="text" name="card_no" id="card_no" class="fil" onKeyUp="CardNoLength()" onKeyDown="CardNoLength()" onKeyPress="CardNoLength()"/> <input type="submit" name="search" value="Search" class="btn" onClick="return CardNoLengthMIN()"/> </form> </div> </center> <br/><hr style="border: 1px solid #606060 ;" /> <center><a href="index.php">Home</a></center> <br/> <center> <?php if(isset($_POST['card_no'])) { if($conn) { if(mysql_select_db("img_mgmt", $conn)) { $sql = "select * from temp_images where card_no='".trim($_POST['card_no'])."'"; $result = mysql_query($sql); $image = mysql_fetch_array($result); if(isset($image['card_no'])) { //echo "<img src=\"".$image['file_path']."\" alt=\"".$image['card_no']."\" width=\"250\" height=\"280\"/>"; header("Content-type: image/jpeg"); echo $image['img_content']; } else { echo "<p style=\"color:red;\">Sorry, Your search came with no results ! <br/> Try with different card number"; } } else { echo "Database selection error: ".mysql_error(); } } else { echo "Could not connect: ".mysql_error(); } } ?> </center> </body> </html> But it after executing the script it shows: Cannot modify header information - headers already sent by (output started at C:\xampp\htdocs\img\search.php:61) in C:\xampp\htdocs\img\search.php on line 77

    Read the article

  • Using ImageMagick to create an image from a PDF...efficiently

    - by bigsweater
    I'm using ImageMagick to create a tiny JPG thumbnail image of an already-uploaded PDF. The code works fine. It's a WordPress widget, though this isn't necessarily WordPress specific. I'm unfamiliar with ImageMagick, so I was hoping somebody could tell me if this looks terrible or isn't following some best practices of some sort, or if I'm risking crashing the server. My questions, specifically, are: Is that image cached, or does the server have to re-generate the image every time somebody views the page? If it isn't cached, what's the best way to make sure the server doesn't have to regenerate the thumbnail? I tried to create a separate folder (/thumbs) for ImageMagick to put all the images in, instead of cluttering up the WP upload folders with images of PDFs. It kept throwing a permission error, despite 777 permissions on the folder in my testing environment. Why? Do the source/destination directories have to be the same? Am I doing anything incorrectly/inefficiently here that needs to be improved? The whole widget is on Pastebin: http://pastebin.com/WnSTEDm7 Relevant code: <?php if ( $url ) { $pdf = $url; $info = pathinfo($pdf); $filename = basename($pdf,'.'.$info['extension']); $uploads = wp_upload_dir(); $file_path = str_replace( $uploads['baseurl'], $uploads['basedir'], $url ); $dest_path = str_replace( '.pdf', '.jpg', $file_path ); $dest_url = str_replace( '.pdf', '.jpg', $pdf ); exec("convert \"{$file_path}[0]\" -colorspace RGB -geometry 60 $dest_path"); ?> <div class="entry"> <div class="widgetImg"> <p><a href="<?php echo $url; ?>" title="<?php echo $filename; ?>"><?php echo "<img src='".$dest_url."' alt='".$filename."' class='blueBorder' />"; ?></a></p> </div> <div class="widgetText"> <?php echo wpautop( $desc ); ?> <p><a class="downloadLink" href="<?php echo $url; ?>" title="<?php echo $filename; ?>">Download</a></p> </div> </div> <?php } ?> As you can see, the widget grabs whatever PDF is attached to the current page being viewed, creates an image of the first page of the PDF, stores it, then links to it in HTML. Thanks for any and all help!

    Read the article

  • Reloading a Flickr request from author

    - by user1797325
    I have my flickr gallery coded, but I want to be able to click on the Author's name and the page will reload just with the images from that author. Here is my current code <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Outbrain Test Gallery</title> <link href="styles.css" rel="stylesheet" type="text/css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script src="jquery.masonry.min.js"></script> <script type="text/javascript"> $(window).load(function(){ $('#flkr').masonry({ // options itemSelector : '.tiles', isResizable: true, }); }); </script> <script type="text/javascript">$(document).ready(function() { $('<ul />').prependTo('#flkr'); $.getJSON('http://api.flickr.com/services/feeds/photos_public.gne?lang=en-us&format=json&jsoncallback=?', function(data) { $.each(data.items, function(i,item) { var squares = (item.media.m).replace('_m.jpg', '_q.jpg'); if(i <= 20){ $('<img/>').attr({ alt: item.title, src: squares, height: '150', width: '150' }).appendTo('#flkr ul').wrap('<li class="tiles"><a href="' + item.link + '"></a><p class="title">' + item.title + '</p><p class="author"><strong>By:</strong> ' + item.author + '</p><p class="date"><strong>Uploaded: </strong>' + item.published + '</p></li>'); } }); }); }); </script> </head> <body> <ul id="flkr"></ul> </body> </html>

    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

  • 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

  • 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

  • position:absolute within border-radius and overflow:hidden

    - by JaNightmare
    I had a problem with border-radius in webkit browsers and found the solution at the following URL: How to make CSS3 rounded corners hide overflow in Chrome/Opera but iam using a another element with position: absolute; inside this now I need to make the caption with rounded border too, but do not know how note: i can't use another border-radius in caption, because this will have an animation see the code with: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Problem</title> <style type="text/css"> img { border: 0; } a { text-decoration: none; } .wrap-events { float: left; position: relative; width: 500px; height: 250px; } .events { overflow: hidden; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .caption { position: absolute; width: 100%; bottom: 0; color: #FFFFFF; background-color: #151515; font: 12px "Arial", Helvetica, sans-serif; opacity: 0.6; border-radius: 0 0 50px 50px; /* add border-radius to caption */ } .caption p { padding: 10px; } </style> </head> <body> <div class="wrap-events"> <div class="events"> <a href="#"> <img src="http://www.cg-auto.com.br/forum/imagens/imagens_news/26c4dc4359edcfd4c6871ee1fa958539.jpg" alt="image"> </a> <div class="caption"> <p>This is a caption</p> </div> </div> </div> <button id="slide">Slide It!</button> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> $('#slide').click(function(){ $('.caption').hide().slideDown(2000); }); </script> </body> </html> cheers

    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

  • Can't parse XML from AJAX response.

    - by Pavel
    Hi everyone. I'm having some problems with parsing the xml response from my ajax script. The XML looks like this: <IMAGE> <a href="address"> <img width="300" height="300" src="image.png class="image" alt="" title="LINKING"/> </a> </IMAGE> <LINK> www.address.com </LINK> <TITLE> This <i>is title</i> </TITLE> <EXCERPT> <p> And some excerpt </p> </EXCERPT> The code for js looks like this. function loadTab(id) { if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { xmlDoc=xmlhttp.responseXML; var title=""; var image=""; x=xmlDoc.getElementsByTagName("TITLE"); for (i=0;i<1;i++) { title=title + x[i].childNodes[0].nodeValue; } document.getElementById("ntt").innerHTML=title; x1=xmlDoc.getElementsByTagName("IMAGE"); for (j=0;j<1;j++) { image=image + x1[j].childNodes[0].nodeValue; } document.getElementById("nttI").innerHTML=image; } } var url = 'http://www.factmag.com/staging/page/?id='+id; xmlhttp.open("GET",url,true); xmlhttp.send(); } When I'm parsing it it pulls out the title but not the IMAGE tag contents. What I'm doing wrong? Can someone please tell me? Thanks in advance!

    Read the article

  • PHP Shared Sessions across Domain

    - by bigstylee
    Hi, I have seen a few answers to this on SOO but most of these are concerned with the use of subdomains, of which none have worked for me. The common one being that the use of session.cookie_domain, which from my understanding will only work with subdomains. I am interested in a solution that deals with deals with entirely different domains (and includes the possibility of subdomains). Unfortunately project deadlines being what they are, time is not on my side, so I turn to SOO's expertise and experience. The current project brief is to be able to log into one site which currently only stores the user_id in the session and then be able to retrieve this value while on a different domain within the same server enviroment. Session data is being stored/retrieved from a database where the session id is the primary key. I am hoping to find a "light wieght" and "easy" to implement solution. The system is utlising an in-house Model View Controller design pattern, so all requests (including different domains) are run through a single bootstrap script. Using the domain name as a variable, this determines what context to display to the user. One option that did look like to have potential is the use of a hidden image and using the alt tag to set the user id. My first impressions suggest this immediately seems "too easy" (if possible) and riddled with security flaws. Disscuss? Another option which I considered is using the IP and User Agent for authentication but again I feel this not going to be a reliable option due to shared networks and changing IP addresses. My third option (and preferred) which I considered and as yet not seen discussed is using htaccess to fool the user into thinking that they are on a different domain when infact apache is redirecting; something like www.foo.com/index.php?domain=bar.com&controller=news/categoires/1 but displays to the user as www.bar.com/news/categories/1 foo.com represents the "main site domain" which all requests are run through and bar.com is what the user thinks they are accessing. The controller request dictates the page and view being requested. Is this possible? Are there other options? Pros/Cons? Thanks in advanced!!!

    Read the article

  • Why won't my images align properly?

    I'm trying to make a dynamically sizable title banner, using fairly simple image tricks. I place the banner image in a table cell, and set the background-image of the table row to a one-pixel-wide repeat of the banner's right-most pixel column. Thus, the banner image appears to stretch to fit the screen width without stretching the logo. The code below is my entire page so far, and the problem is shown in a red circle in the screenshot. This is the transition where the main image ends and the one-pixel-wide background image begins. It appears that the one-pixel-wide bar at the end is compressed by one pixel - making the tops align properly, while the bottoms are one pixel off. I should add that I have checked the images more than once to make cure they the image data is correct. They are %100 accurate as far as MSPaint is concerned. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!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 runat="server"> <title></title> </head> <body bgcolor="#000000"> <form id="form1" runat="server"> <div> <table style="width:100%; "> <tr style="background-image: url('Images/Banners/WebBannerWideBar.png')"> <!--WebBannerWideBar is 1x100 px--> <td> <img alt="Angry Octopus" src="Images/Banners/WebBannerWide.png" /> <!--WebBannerWide is 760x100 px--> </td> </tr> </table> </div> </form> </body> </html>

    Read the article

  • Javascript problem when setting src for img element in FireFox - string parsing error?

    - by Kevin
    I'm having problems with image's on the page. I'm using Javascript to create the elements, and in FireFox it seems the string that I'm using to set the innerHTML is not being parsed correctly. I'll see this when the server page is requested with invalid GET variables. They look like this (from the PHP script's error handler): GET[] = Array ( [shrink] => true [file_id] => \' file_id \' [refresh] => \' now.getTime() \' ) This only happens for about 5% of requests, which is making it difficult to solve. I have been able to reproduce this myself in FireFox, and Firebug will show that the URL it is trying to fetch is: https://www.domain.com/secure/%27%20+%20image_src%20+%20%27 I read somewhere that it might be related to FireFox prefetching content (can't find it googling now), since it seems to only happen on FireFox. Disabling prefetching in about:config does prevent the problem from occurring, but I'm looking for another solution or workaround that doesn't involve end users changing their configurations. Here's the specifics and code: I have an empty table cell on an HTML page. In JQuery's $(document).ready() function for the page, I used JQuery's $.ajax() method to get some data from the server about what should be in that cell. It returns the file_id variable, which for simplicity I just set below. It then sets the empty table cell to have an image with src that points to a page that will serve the image file depending on what file_id is passed. This part of the code was JQuery originally, so I changed it to straight Javascript but that didn't help anything. //get data about image from server //this is actually done through JQuery's $.ajax() but you get the idea var file_id = 12; //create the src for the img //the refresh is to prevent the image from being cached ever, since the page's //javascript will be it changes //during the course of the page's life var now = new Date(); var image_src = 'serve_image.php?shrink=true&file_id=' + file_id + '&refresh=' + now.getTime(); //create document.getElementById('image_cell').innerHTML = '<A target="_blank" href="serve_image.php?file_id=' + file_id + '">' + '<IMG id=image_element src="' + image_src + '" alt="Loading...">' + '</A>';` Any help would be greatly appreciated. Thanks!

    Read the article

  • No image displayed in Fancybox

    - by seansean11
    I am having trouble getting fancybox to display its corresponding images on a website that I'm building http://www.nomadicdrift.com/test/kaniwa#events . It's a custom one page portfolio theme that I set up on the WordPress platform. If you follow the link to the events section you will see 1 figure item in a gallery like position. I have this image set up to work as a fancybox gallery, but when you click on it, it opens up the fancybox interface but does not place a image in the frame, even though it should. So this is the problem...the images do not show up in fancybox and instead I see just the frame. Here is the html that I'm displaying: <figure> <a class="fancybox" data-fancybox-type="Fashion Show de Paris, France" href="http://www.nomadicdrift.com/test/kaniwa/wp-content/uploads/2012/07/NM2.jpg"> <img class="attachment-evento wp-post-image" width="231" height="191" title="NM" alt="NM" src="http://www.nomadicdrift.com/test/kaniwa/wp-content/uploads/2012/07/NM2-231x191.jpg"> </a> <figcaption> <a class="fancybox" data-fancybox-type="Fashion Show de Paris, France" href="http://www.nomadicdrift.com/test/kaniwa/wp-content/uploads/2012/07/CEDESAN.jpg"> </a> <h4>Fashion Show de Paris, France</h4> </figcaption> </figure> I'm not going to bore you with the PHP that I used to get that output because I think the problem lies elsewhere. ***I have tried to set up a simple standard fancybox gallery on the site also, but it gives me thes same problem, leading me to believe that the problem is deeper than the html markup. I have also successfully used this same markup for a one thumbnail fancybox gallery on another site. I thought maybe it was due to some conflict in the .js files I'm using. I tried uninstalling all of my plugins/addons (which aren't too many) one by one and still had the same result. I have all of my personal javascript in the functions.js file, which is where I call the fancybox plugin using the standard $("a.fancybox").fancybox();. I have installed this plugin before on other sites and have searched extensively for an answer, so any help is greatly appreciated. Thanks, Sean

    Read the article

  • jQuery animate slidding background image using mouse position wont stop... just keeps going

    - by simian
    I have a neat little jQuery script I am working on. Goal: parent div with overflow hidden holds a larger div with image. When I move the mouse to the left or right of the parent div, the div with image changes margin-left to move left or right. Problem is... if I move the mouse out of the parent div (left or right), the image keeps going. I need the image to stop when the mouse is not on the inside left or right edge of the parent div. Any ideas? <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> //<![CDATA[ jQuery.noConflict (); jQuery(document).ready(function(){ jQuery('#container').mousemove(function(e){ var parentWidth = jQuery('#container').width(); var parentWidthLeft = Math.round(.1 * jQuery('#container').width()); var parentWidthRight = Math.round(jQuery('#container').width() - parentWidthLeft); var parentHeight = jQuery('#container').height(); var parentOffset = jQuery('#container').offset(); var X = Math.round(e.pageX - parentOffset.left); var Y = Math.round(e.pageY - parentOffset.top); if (X<parentWidthLeft) { jQuery('#image').animate({'left': '-' + parentWidth }, 5000); } if (X>parentWidthRight) { jQuery('#image').animate({'left': parentWidth }, 5000); } if (X<=parentWidthRight && X>=parentWidthLeft) { jQuery('#image').stop(); } if (X<1) { jQuery('#image').stop(); } }); jQuery('#container').mouseleave(function(){ jQuery('#image').stop(); }); }); // ]]> </script> </head> <body> <div id="container" style="width: 500px; height: 500px; overflow: hidden; border: 10px solid #000; position: relative; margin: auto auto;"> <div id="image" style="position: absolute; left: 0; top: 0;"><img src="http://dump4free.com/imgdump/1/Carmen-Electra_1wallpaper1024x768.jpg" alt="" /></div> </div> </body> </html>

    Read the article

  • Codeigniter: Retrieving data on button click with Ajax

    - by OllyTenerife
    I have a simple webpage which generates a random quote from my database upon refreshing the page. I wish to implement some AJAX and JQuery in order to generate quotes via the button rather than having to refresh the page. I have done some research but I am not sure how to implement this in Codeigniter. My current code is below... Page controller: public function index() { $this->load->model('quote_model', '', TRUE); $data['quotes'] = $this->quote_model->getRandom(); $this->load->view('home', $data); } The view: <?php include ('layout/header.php'); ?> <div class="container-fluid"> <div class="row"> <div class="col-md-4 quote-holder"> <img src="application/assets/alan1.jpg" alt="..." class="img-circle img-responsive"> <br> <blockquote class="text-center"> <p><?php echo $quotes[0]['quote']; ?></p> <footer class="text-center"><?php echo $quotes[0]['character_name']; ?> in <cite title="Source Title"><?php echo $quotes[0]['series_name']; ?></cite></footer> </blockquote> <button type="button" class="btn btn-default center-block">Generate quote</button> </div> </div> <?php include ('layout/footer.php'); ?> Here is the function in the model I am retrieving the data from: function getRandom() { $query = $this->db->query(" SELECT * FROM quotes, characters, series WHERE quotes.series_id = series.series_id AND quotes.character_id = characters.character_id ORDER BY rand() LIMIT 1 "); return $query->result_array(); } Should I simply be using something like this? $("button").click(function(){ $.get( "Page/index", function( data ) { //output data to page element... } });

    Read the article

  • OCR anything with OneNote 2007 and 2010

    - by Matthew Guay
    Quality OCR software can often be very expensive, but you may have one already installed on your computer that you didn’t know about.  Here’s how you can use OneNote to OCR anything on your computer. OneNote is one of the overlooked gems in recent versions of Microsoft Office.  OneNote makes it simple to take notes and keep track of everything with integrated search, and offers more features than its popular competitor Evernote.  One way it is better is its high quality optical character recognition (OCR) engine.  One of Evernote’s most popular features is that you can search for anything, including text in an image, and you can easily find it.  OneNote takes this further, and instantly OCRs any text in images you add.  Then, you can use this text easily and copy it from the image.  Let’s see how this works and how you can use OneNote as the ultimate OCR. Please Note: This feature is available in OneNote 2007 and 2010.  OneNote 2007 is included with Office 2007 Home and Student, Enterprise, and Ultimate, while OneNote 2010 is included with all edition of Office 2010 except for Starter edition. OCR anything First, let’s add something to OCR into OneNote.  There are many different ways you can add items to OCR into OneNote.  Open a blank page or one you want to insert something into, and then follow these steps to add what you want into OneNote. Picture Simply drag-and-drop a picture with text into a notebook… You can insert a picture directly from OneNote as well.  In OneNote 2010, select the Insert tab, and then choose Picture. In OneNote 2007, select the Insert menu, select Picture, and then choose From File.   Screen Clipping There are many times we’d like to copy text from something we see onscreen, but there is no direct way to copy text from that thing.  For instance, you cannot copy text from the title-bar of a window, or from a flash-based online presentation.  For these cases, the Screen Clipping option is very useful.  To add a clip of anything onscreen in OneNote 2010, select the Insert tab in the ribbon and click Screen Clipping. In OneNote 2007, either click the Clip button on the toolbar or select the Insert menu and choose Screen Clipping.   Alternately, you can take a screen clipping by pressing the windows key + S. When you click Screen Clipping, OneNote will minimize, your desktop will fade lighter, and your mouse pointer will change to a plus sign.  Now, click and drag over anything you want to add to OneNote.  Here we’re selecting the title of this article. The section you selected will now show up in your OneNote notebook, complete with the date and time the clip was made. Insert a file You’re not limited to pictures; OneNote can even OCR anything in most files on your computer.  You can add files directly in OneNote 2010 by selecting File Printout in the Insert tab. In OneNote 2007, select the Insert menu and choose Files as Printout. Choose the file you want to add to OneNote in the dialog. Select Insert, and OneNote will pause momentarily as it processes the file. Now your file will show up in OneNote as a printout with a link to the original file above it. You can also send any file directly to OneNote via the OneNote virtual printer.  If you have a file open, such as a PDF, that you’d like to OCR, simply open the print dialog in that program and select the “Send to OneNote” printer. Or, if you have a scanner, you can scan documents directly into OneNote by clicking Scanner Printout in the Insert tab in OneNote 2010. In OneNote 2003, to add a scanned document select the Insert menu, select Picture, and then choose From Scanner or Camera. OCR the image, file, or screenshot you put in OneNote Now that you’ve got your stuff into OneNote, let’s put it to work.  OneNote automatically did an OCR scan on anything you inserted into OneNote.  You can check to make sure by right-clicking on any picture, screenshot, or file you inserted.  Select “Make Text in Image Searchable” and then make sure the correct language is selected. Now, you can copy text from the Picture.  Simply right-click on the picture, and select “Copy Text from Picture”. And here’s the text that OneNote found in this picture: OCR anything with OneNote 2007 and 2010 - Windows Live Writer Not bad, huh?  Now you can paste the text from the picture into a document or anywhere you need to use the text. If you are instead copying text from a printout, it may give you the option to copy text from this page or all pages of the printout.   This works the exact same in OneNote 2007. In OneNote 2010, you can also edit the text OneNote has saved in the image from the OCR.  This way, if OneNote read something incorrectly you can change it so you can still find it when you use search in OneNote.  Additionally, you can copy only a specific portion of the text from the edit box, so it can be useful just for general copying as well.  To do this, right-click on the item and select “Edit Alt Text”. Here is the window to edit alternate text.  If you want to copy only a portion of the text, simply select it and press Ctrl+C to copy that portion. Searching OneNote’s OCR engine is very useful for finding specific pictures you have saved in OneNote.  Simply enter your search query in the search box on top right, and OneNote will automatically find all instances of that term in all of your notebooks.  Notice how it highlights the search term even in the image! This works the same in OneNote 2007.  Notice how it highlighted “How-to” in a shot of the header image in our favorite website. In Windows Vista and 7, you can even search for things OneNote OCRed from the Start Menu search.  Here the start menu search found the words “Windows Live Writer” in our OCR Test notebook in OneNote where we inserted the screen clip above. Conclusion OneNote is a very useful OCR tool, and can help you capture text from just about anything.  Plus, since you can easily search everything you have stored in OneNote, you can quickly find anything you insert anytime.  OneNote is one of the least-used Office tools, but we have found it very useful and hope you do too. Similar Articles Productive Geek Tips Add or Remove Apps from the Microsoft Office 2007 or 2010 SuiteRemove Office 2010 Beta and Reinstall Office 2007How To Create and Publish Blog Posts in Word 2010 & 2007How To Copy Worksheets in Excel 2007 & 2010Add Page Numbers to Documents in Word 2007 & 2010 TouchFreeze Alternative in AutoHotkey The Icy Undertow Desktop Windows Home Server – Backup to LAN The Clear & Clean Desktop Use This Bookmarklet to Easily Get Albums Use AutoHotkey to Assign a Hotkey to a Specific Window Latest Software Reviews Tinyhacker Random Tips DVDFab 6 Revo Uninstaller Pro Registry Mechanic 9 for Windows PC Tools Internet Security Suite 2010 Using TrueCrypt to Secure Your Data Quickly Schedule Meetings With NeedtoMeet Share Flickr Photos On Facebook Automatically Are You Blocked On Gtalk? Find out Discover Latest Android Apps On AppBrain The Ultimate Guide For YouTube Lovers

    Read the article

< Previous Page | 131 132 133 134 135 136 137 138 139 140 141 142  | Next Page >