Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Oct 2008
    Posts
    130
    Thanks
    0
    Thanked 4 Times in 4 Posts

    open close bar help

    ok so i have a floating opaacity-70% bar that has a find in page script

    when you click close, it closes the bar but i want like a show hide thing or in addition to a close function, i want an open function so you dont have to restart the page for the bar to reapear

    this is my code
    <script>
    <!-- Hide from old browsers

    /******************************************
    * Find In Page Script -- Submitted/revised by Alan Koontz (alankoontz@REMOVETHISyahoo.com)
    * Visit Dynamic Drive (http://www.dynamicdrive.com/) for full source code
    * This notice must stay intact for use
    ******************************************/

    // revised by Alan Koontz -- May 2003

    var TRange = null;
    var dupeRange = null;
    var TestRange = null;
    var win = null;


    // SELECTED BROWSER SNIFFER COMPONENTS DOCUMENTED AT
    // http://www.mozilla.org/docs/web-deve...wser_type.html

    var nom = navigator.appName.toLowerCase();
    var agt = navigator.userAgent.toLowerCase();
    var is_major = parseInt(navigator.appVersion);
    var is_minor = parseFloat(navigator.appVersion);
    var is_ie = (agt.indexOf("msie") != -1);
    var is_ie4up = (is_ie && (is_major >= 4));
    var is_not_moz = (agt.indexOf('netscape')!=-1)
    var is_nav = (nom.indexOf('netscape')!=-1);
    var is_nav4 = (is_nav && (is_major == 4));
    var is_mac = (agt.indexOf("mac")!=-1);
    var is_gecko = (agt.indexOf('gecko') != -1);
    var is_opera = (agt.indexOf("opera") != -1);


    // GECKO REVISION

    var is_rev=0
    if (is_gecko) {
    temp = agt.split("rv:")
    is_rev = parseFloat(temp[1])
    }


    // USE THE FOLLOWING VARIABLE TO CONFIGURE FRAMES TO SEARCH
    // (SELF OR CHILD FRAME)

    // If you want to search another frame, change from "self" to
    // the name of the target frame:
    // e.g., var frametosearch = 'main'

    //var frametosearch = 'main';
    var frametosearch = self;


    function search(whichform, whichframe) {

    // TEST FOR IE5 FOR MAC (NO DOCUMENTATION)

    if (is_ie4up && is_mac) return;

    // TEST FOR NAV 6 (NO DOCUMENTATION)

    if (is_gecko && (is_rev <1)) return;

    // TEST FOR Opera (NO DOCUMENTATION)

    if (is_opera) return;

    // INITIALIZATIONS FOR FIND-IN-PAGE SEARCHES

    if(whichform.findthis.value!=null && whichform.findthis.value!='') {

    str = whichform.findthis.value;
    win = whichframe;
    var frameval=false;
    if(win!=self)
    {

    frameval=true; // this will enable Nav7 to search child frame
    win = parent.frames[whichframe];

    }


    }

    else return; // i.e., no search string was entered

    var strFound;

    // NAVIGATOR 4 SPECIFIC CODE

    if(is_nav4 && (is_minor < 5)) {

    strFound=win.find(str); // case insensitive, forward search by default

    // There are 3 arguments available:
    // searchString: type string and it's the item to be searched
    // caseSensitive: boolean -- is search case sensitive?
    // backwards: boolean --should we also search backwards?
    // strFound=win.find(str, false, false) is the explicit
    // version of the above
    // The Mac version of Nav4 has wrapAround, but
    // cannot be specified in JS


    }

    // NAVIGATOR 7 and Mozilla rev 1+ SPECIFIC CODE (WILL NOT WORK WITH NAVIGATOR 6)

    if (is_gecko && (is_rev >= 1)) {

    if(frameval!=false) win.focus(); // force search in specified child frame
    strFound=win.find(str, false, false, true, false, frameval, false);

    // The following statement enables reversion of focus
    // back to the search box after each search event
    // allowing the user to press the ENTER key instead
    // of clicking the search button to continue search.
    // Note: tends to be buggy in Mozilla as of 1.3.1
    // (see www.mozilla.org) so is excluded from users
    // of that browser.

    if (is_not_moz) whichform.findthis.focus();

    // There are 7 arguments available:
    // searchString: type string and it's the item to be searched
    // caseSensitive: boolean -- is search case sensitive?
    // backwards: boolean --should we also search backwards?
    // wrapAround: boolean -- should we wrap the search?
    // wholeWord: boolean: should we search only for whole words
    // searchInFrames: boolean -- should we search in frames?
    // showDialog: boolean -- should we show the Find Dialog?


    }

    if (is_ie4up) {

    // EXPLORER-SPECIFIC CODE revised 5/21/03

    if (TRange!=null) {

    TestRange=win.document.body.createTextRange();



    if (dupeRange.inRange(TestRange)) {

    TRange.collapse(false);
    strFound=TRange.findText(str);
    if (strFound) {
    //the following line added by Mike and Susan Keenan, 7 June 2003
    win.document.body.scrollTop = win.document.body.scrollTop + TRange.offsetTop;
    TRange.select();
    }


    }

    else {

    TRange=win.document.body.createTextRange();
    TRange.collapse(false);
    strFound=TRange.findText(str);
    if (strFound) {
    //the following line added by Mike and Susan Keenan, 7 June 2003
    win.document.body.scrollTop = TRange.offsetTop;
    TRange.select();
    }



    }
    }

    if (TRange==null || strFound==0) {
    TRange=win.document.body.createTextRange();
    dupeRange = TRange.duplicate();
    strFound=TRange.findText(str);
    if (strFound) {
    //the following line added by Mike and Susan Keenan, 7 June 2003
    win.document.body.scrollTop = TRange.offsetTop;
    TRange.select();
    }


    }

    }

    if (!strFound) alert ("Searched word, '"+str+"' not found--Try being less specific or check your spelling") // string not found


    }
    // -->
    </script>



    <STYLE type=text/css>
    a:link {
    COLOR: #696969;
    }
    a:visited {
    COLOR: #696969;
    }
    a:hover {
    COLOR: #000000 ;
    }
    a:active {
    COLOR: #696969;
    }
    </STYLE>

    <STYLE><!--
    a
    {

    text-decoration:none;
    color:#000000;
    }
    --></STYLE>
    <style type="text/css">
    <!--
    body {
    background:url(http://hstrial-dbayly.homestead.com/files/dog.jpg) no-repeat top left;
    margin:0;
    }
    #one {
    background:#000000;
    width:200px;
    height:216px;
    filter: progid: DXImageTransform.Microsoft.Alpha(opacity=20);
    -moz-opacity:0.20;
    position:absolute;
    top:0;
    left:0;
    }
    #two {
    width:200px;
    height:216px;
    position:absolute;
    top:0;
    left:0;
    font-family:arial;
    font-size:18px;
    color:#ffffff;
    padding:20px;
    }
    //-->
    </style>



    <style type="text/css">

    #topbar{
    position:absolute;

    padding: 2px;
    background-color: transparent;
    width: 620px;
    visibility: hidden;
    z-index: 100;
    }

    </style>

    <script type="text/javascript">

    /***********************************************
    * Floating Top Bar script- &#169; Dynamic Drive (www.dynamicdrive.com)
    * Sliding routine by Roy Whittle (http://www.javascript-fx.com/)
    * This notice must stay intact for legal use.
    * Visit http://www.dynamicdrive.com/ for full source code
    ***********************************************/

    var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
    var startX = 30 //set x offset of bar in pixels
    var startY = 5 //set y offset of bar in pixels
    var verticalpos="fromtop" //enter "fromtop" or "frombottom"

    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }

    function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = "";
    if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) {
    offset += search.length
    end = document.cookie.indexOf(";", offset);
    if (end == -1) end = document.cookie.length;
    returnvalue=unescape(document.cookie.substring(offset, end))
    }
    }
    return returnvalue;
    }

    function closebar(){
    if (persistclose)
    document.cookie="remainclosed=1"
    document.getElementById("topbar").style.visibility="hidden"
    }

    function staticbar(){
    barheight=document.getElementById("topbar").offsetHeight
    var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
    var d = document;
    function ml(id){
    var el=d.getElementById(id);
    if (!persistclose || persistclose && get_cookie("remainclosed")=="")
    el.style.visibility="visible"
    if(d.layers)el.style=el;
    el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
    el.x = startX;
    if (verticalpos=="fromtop")
    el.y = startY;
    else{
    el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
    el.y -= startY;
    }
    return el;
    }
    window.stayTopLeft=function(){
    if (verticalpos=="fromtop"){
    var pY = ns ? pageYOffset : iecompattest().scrollTop;
    ftlObj.y += (pY + startY - ftlObj.y)/8;
    }
    else{
    var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
    ftlObj.y += (pY - startY - ftlObj.y)/8;
    }
    ftlObj.sP(ftlObj.x, ftlObj.y);
    setTimeout("stayTopLeft()", 10);
    }
    ftlObj = ml("topbar");
    stayTopLeft();
    }

    if (window.addEventListener)
    window.addEventListener("load", staticbar, false)
    else if (window.attachEvent)
    window.attachEvent("onload", staticbar)
    else if (document.getElementById)
    window.onload=staticbar
    </script>

    <div id="topbar" div id="two">
    <table bgcolor="black" style="filter: alpha (opacity=70);" width="620">
    <tr><td>




    <!-- EXAMPLE FORM OF FIND-IN-PAGE SEARCH USING SUBMIT (ALLOWING 'ENTER/RETURN' KEY PRESS EVENT) -->
    <form name="form1" onSubmit="search(document.form1, frametosearch); return false"> <span style="position: relative;"><a href="" onClick="closebar(); return false"> <font color="white" face="arial" size="3">[Close]</a> &nbsp;&nbsp; <input type="text" name="findthis" size="15" title="Press 'ALT s' after clicking submit to repeatedly search page"> <input type="submit" value="Find in Page" ACCESSKEY="s"></form>
    <font size=2 face=arial>
    </table>
    </td>
    </tr>


    </div>
    <br><br><br><br>
    <DIR>
    HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HE Y<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY< BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR >HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>HEY<BR>
    Last edited by GardenGnome2; 10-27-2008 at 01:07 AM. Reason: get rid of smilies

  • #2
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    Add highlighted on closebar function:
    Code:
    function closebar(){
    if (persistclose)
    document.cookie="remainclosed=1"
    document.getElementById("topbar").style.visibility="hidden"
    document.getElementById('show').style.display=''; // Show "show" div
    }
    ...and add this unto your markup:
    Code:
    <p id="show" style="display:none;" onclick="staticbar();this.style.display='none'">
    Show
    </p>
    Hope that helps.
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #3
    Regular Coder
    Join Date
    Oct 2008
    Posts
    130
    Thanks
    0
    Thanked 4 Times in 4 Posts
    no it didnt work at all

  • #4
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    In what way did my suggestion failed?

    I tested it out on FF, IE, Safari, and Opera (at least) and it works well. You might have messed on the script.

    Show us a link so we could take a closer look.
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #5
    Regular Coder
    Join Date
    Oct 2008
    Posts
    130
    Thanks
    0
    Thanked 4 Times in 4 Posts
    i have no real link im using a test bed, but can u give me the full code, maybe it will work

    i probably did mess up the script and im really new here so please can i just have the complete script, i dont kno wats wrong...
    Last edited by GardenGnome2; 10-28-2008 at 11:42 AM.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •